← Back to Layouts
Kimi ni Todoke - Sawako & Kazehaya

Name: FriendRewind
Author: FriendRewind
Author: xoxo_soph ♡
Category: Classic
Created: August 31, 2026
Perfil con estética pastel/romántica de Kimi ni Todoke con pétalos de cerezo y tonos moka/rosa pastel.
Comments (0)

No comments yet. Be the first!
You must log in to comment.
CSS Code

<style id="fr-vb2">
/* VB2_STATE:{"cursorUrl":"","overlayUrl":"","overlayOpacity":0.2,"avatarAnimation":"","pageFont":"","useLiveProfile":true,"previewUrl":"/profile?id=4","pageBgImage":"","pageBgMode":"cover","heroImageUrl":"","profileRowBgImage":"","profileRowBgMode":"cover","navBgColor":"#2b333f","navBgImage":"","navBgMode":"cover","navLinkColor":"#ffffff","navLinkHover":"#66aaff","boxBgColor":"#ffffff","boxOpacity":1,"boxRadius":8,"contactHeaderBg":"#4169E1","contactHeaderText":"#ffffff","contactContentBg":"#ffffff","contactBorderColor":"#4169E1","contactBorderWidth":1,"contactBorderRadius":5,"contactBoxAnimation":"","interestsHeaderBg":"#DAA520","interestsHeaderText":"#ffffff","interestsContentBg":"#ffffff","interestsBorderColor":"#DAA520","interestsBorderWidth":1,"interestsBorderRadius":5,"contentBoxAnimation":"","textBody":"#000000","textHeading":"#000000","textLink":"#0066cc","headingShadowColor":"#000000","headingShadowBlur":2,"headingShadowEnable":false,"moduleImages":{"contact":"","urlInfo":"","tableSection":"","tunes":"","blogPreview":"","blurbs":"","friends":"","Comments Background":"","comments":""}} */
/* Generated by FriendRewind.com Visual Builder */
</style><style>


/* FR_MANUAL_EXTRAS */
/* =========================================================
   FRIEND REWIND - TEMA KIMI NI TODOKE
   Paleta: #694A47 (Marrón cálido), #96C1C5 (Azul celeste/Verde agua), #FFF0DE (Crema/Rosa suave)
   ========================================================= */

/* Cursor personalizado de Rilakkuma */
html, body, a, button, input {
    cursor: url('https://cur.cursors-4u.net/anime/ani-12/ani1153.png'), auto !important;
}

/* Fondo principal del perfil */
body.profile-page, body {
    background-color: #FFF0DE !important;
    color: #694A47 !important;
    font-family: 'Trebuchet MS', 'Segoe UI', sans-serif !important;
}

/* Contenedores y Cajas del perfil */
.profile-container, .box, .section, .cajas-de-contenido {
    background-color: rgba(255, 255, 255, 0.85) !important;
    border: 2px solid #96C1C5 !important;
    border-radius: 12px !important;
    box-shadow: 0px 4px 12px rgba(105, 74, 71, 0.15) !important;
}

/* Encabezados y Barras de Título */
.heading, h1, h2, h3, .barra-de-navegacion {
    background: linear-gradient(135deg, #694A47, #855f5b) !important;
    color: #FFF0DE !important;
    border-radius: 8px 8px 0 0 !important;
    font-weight: bold !important;
}

/* Enlaces e Interacción */
a {
    color: #694A47 !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
}

a:hover {
    color: #96C1C5 !important;
    text-shadow: 0 0 5px rgba(150, 193, 197, 0.6) !important;
}

/* Foto de perfil y bordes */
.profile-pic img, .avatar {
    border: 3px solid #96C1C5 !important;
    border-radius: 50% !important;
    box-shadow: 0 0 10px rgba(105, 74, 71, 0.2) !important;
}

/* =========================================================
   ANIMACIÓN: LLUVIA DE PÉTALOS DE CEREZO (SAKURA)
   ========================================================= */

@keyframes cherry-fall {
    0% {
        top: -10%;
        transform: translateX(0) rotate(0deg);
        opacity: 0.9;
    }
    100% {
        top: 105%;
        transform: translateX(100px) rotate(360deg);
        opacity: 0.2;
    }
}

.sakura-petal {
    position: fixed;
    top: -10%;
    z-index: 9999;
    pointer-events: none;
    width: 15px;
    height: 15px;
    background-color: #ffc0cb;
    border-radius: 15px 0px 15px 0px;
    opacity: 0.7;
    animation: cherry-fall 10s linear infinite;
}

/* Generación de varias hojas con distintas trayectorias */
.sakura-petal:nth-child(1) { left: 10%; animation-duration: 8s; animation-delay: 0s; }
.sakura-petal:nth-child(2) { left: 25%; animation-duration: 12s; animation-delay: 2s; }
.sakura-petal:nth-child(3) { left: 40%; animation-duration: 9s; animation-delay: 4s; }
.sakura-petal:nth-child(4) { left: 60%; animation-duration: 11s; animation-delay: 1s; }
.sakura-petal:nth-child(5) { left: 75%; animation-duration: 7s; animation-delay: 3s; }
.sakura-petal:nth-child(6) { left: 90%; animation-duration: 10s; animation-delay: 5s; }
</style>