Nyan Cat layout!!!

Name: FriendRewind
Author: FriendRewind
Author: ★𝘞illow ˃𖥦˂
Category: Colorful
Created: October 30, 2026
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 */
</style>
<style>


/* FR_MANUAL_EXTRAS */
</style>
<style>


/* FR_MANUAL_EXTRAS */
/* ==========================================
   NYAN CAT GALAXY
   FRIENDREWIND - VERSAO 1.0
   ========================================== */


/* ==========================================
   1. FONTES
   ========================================== */

@import url('https://fonts.googleapis.com/css2?family=Silkscreen:wght@400;700&family=Nunito:wght@400;600;700;800&display=swap');

/* Cursor Nyan Cat Sparkly */
@import url('https://cdn.cursors-4u.net/cursors/animated/animated-nyan-cat-sparkly-164bbfbf-32.css');


/* ==========================================
   2. PALETA DE CORES
   ========================================== */

:root {
    -blue: #042D6A;
    -red: #ED1535;
    -pink: #F4BAFB;
    -yellow: #F4FBB9;
}


/* ==========================================
   3. FUNDO DA PAGINA
   ========================================== */

body.profile-page {
    background-color: var(--blue) !important;

    background-image:
        url('https://i.ibb.co/8FGrXgR/f5767688e7f7f6b3cee617a487cc2f76.jpg') !important;

    background-size: cover !important;
    background-position: center !important;
    background-attachment: fixed !important;
    background-repeat: no-repeat !important;

    color: var(--yellow) !important;
    font-family: 'Nunito', sans-serif !important;
}


/* ==========================================
   4. TELA PRINCIPAL
   ========================================== */

body.profile-page .master-container {
    max-width: 960px !important;
    box-sizing: border-box !important;

    background: rgba(4, 45, 106, 0.94) !important;

    border: 6px solid var(--red) !important;
    border-radius: 10px !important;

    box-shadow:
        0 0 12px var(--red),
        0 0 25px rgba(237, 21, 53, 0.45) !important;

    padding: 10px !important;
}


/* ==========================================
   5. CABECALHO ANIMADO
   ========================================== */

body.profile-page .master-container::before {
    content: "";
    display: block;

    width: 100%;
    height: 170px;

    background-image:
        url('https://i.ibb.co/B58yrHN7/07f64dd82f0bcc2fe71d68187c2c98bf-1.gif');

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    border: 3px solid var(--pink);
    border-radius: 7px;

    margin-bottom: 15px;
}


/* ==========================================
   6. FUNDO DO PERFIL
   ========================================== */

body.profile-page .row.profile {
    background-image:
        url('https://i.ibb.co/7J0Pfh9G/f9b5e3d7f541e2826c8478b136b6dd03.jpg') !important;

    background-size: cover !important;
    background-position: center !important;

    border-radius: 8px !important;
    padding: 10px !important;
}


/* ==========================================
   7. BARRA DE NAVEGACAO
   ========================================== */

body.profile-page nav,
body.profile-page nav .top,
body.profile-page nav .links {
    background-color: var(--blue) !important;
}

body.profile-page nav {
    border-bottom: 3px solid var(--red) !important;
}

body.profile-page nav .links a {
    color: var(--pink) !important;
    font-weight: 800 !important;
}

body.profile-page nav .links a:hover {
    color: var(--yellow) !important;
    text-shadow: 0 0 8px var(--yellow) !important;
}


/* ==========================================
   8. TIPOGRAFIA
   ========================================== */

body.profile-page {
    font-size: 14px !important;
    line-height: 1.6 !important;
}

body.profile-page h1,
body.profile-page h2,
body.profile-page h3,
body.profile-page h4,
body.profile-page .heading {
    font-family: 'Silkscreen', monospace !important;
    font-weight: 700 !important;
}

body.profile-page .heading h1,
body.profile-page .heading h4 {
    color: var(--yellow) !important;
    text-shadow: 2px 2px var(--blue) !important;
}

body.profile-page p,
body.profile-page td {
    color: var(--yellow) !important;
}

body.profile-page a {
    color: var(--pink) !important;
}


/* ==========================================
   9. TITULOS DOS MODULOS
   ========================================== */

body.profile-page .heading {
    background: linear-gradient(
        90deg,
        var(--blue),
        var(--red)
    ) !important;

    border: 2px solid var(--pink) !important;
    border-radius: 7px 7px 0 0 !important;
}


/* ==========================================
   10. IMAGENS DOS MODULOS
   ========================================== */

/* ABOUT ME */

body.profile-page .blurbs {
    background-image:
        linear-gradient(
            rgba(4, 45, 106, 0.68),
            rgba(4, 45, 106, 0.68)
        ),
        url('https://i.ibb.co/SXgRZd2W/747a401c0daac6b580fd1ffc4e5c3039.gif') !important;

    background-size: cover !important;
    background-position: center !important;
}


/* INTERESTS */

body.profile-page .table-section {
    background-image:
        linear-gradient(
            rgba(4, 45, 106, 0.68),
            rgba(4, 45, 106, 0.68)
        ),
        url('https://i.ibb.co/hxFW8NMc/eacef16e5102d44bb263073205d756c1.gif') !important;

    background-size: cover !important;
    background-position: center !important;
}


/* CONTACT */

body.profile-page .contact {
    background-image:
        linear-gradient(
            rgba(4, 45, 106, 0.68),
            rgba(4, 45, 106, 0.68)
        ),
        url('https://i.ibb.co/mfPYvFD/b67c5f0e06a0721a0f570faca6ea2c5c.gif') !important;

    background-size: cover !important;
    background-position: center !important;
}


/* MY FRIENDS */

body.profile-page .friends {
    background-image:
        linear-gradient(
            rgba(4, 45, 106, 0.68),
            rgba(4, 45, 106, 0.68)
        ),
        url('https://i.ibb.co/YBQbXcbc/80dbe7a37ca3ea65ecac8dace1b599cc.gif') !important;

    background-size: cover !important;
    background-position: center !important;
}




/* ==========================================
   11. APARENCIA DAS CAIXAS
   ========================================== */

body.profile-page .blurbs,
body.profile-page .table-section,
body.profile-page .contact,
body.profile-page .friends,
body.profile-page .profile-playlist-widget,
body.profile-page .general-about,
body.profile-page .blog-preview,
body.profile-page .photos-preview,
body.profile-page .videos-preview,
body.profile-page #comments {

    background-color: rgba(4, 45, 106, 0.90) !important;

    border: 2px solid var(--pink) !important;
    border-radius: 8px !important;

    box-shadow:
        0 0 8px rgba(244, 186, 251, 0.35) !important;

    position: relative !important;
}

body.profile-page .section {
    background-color: transparent !important;
}


/* ==========================================
   12. ANIMACAO DE FLUTUACAO
   ========================================== */

@keyframes nyanFloat {
    0%, 100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-7px);
    }
}

body.profile-page .blurbs,
body.profile-page .contact,
body.profile-page .friends,
body.profile-page .general-about,
body.profile-page .table-section,
body.profile-page .photos-preview,
body.profile-page .videos-preview,
body.profile-page #comments,
body.profile-page .badges-widget {

    animation: nyanFloat 4s ease-in-out infinite !important;
}

body.profile-page .blurbs {
    animation-duration: 4.2s !important;
}

body.profile-page .contact {
    animation-duration: 3.7s !important;
}

body.profile-page .friends {
    animation-duration: 4.6s !important;
}

body.profile-page .table-section {
    animation-duration: 3.9s !important;
}

body.profile-page .general-about {
    animation-duration: 4.4s !important;
}


/* ==========================================
   13. ELEMENTOS SEM FLUTUACAO
   ========================================== */

body.profile-page .profile-pic,
body.profile-page .profile-pic img,
body.profile-page .profile-playlist-widget,
body.profile-page .blog-preview,
body.profile-page .url-info {

    animation: none !important;
    transform: none !important;
}


/* ==========================================
   14. MOLDURA ANIMADA DO AVATAR
   ========================================== */

body.profile-page .profile-pic {
    position: relative !important;
    overflow: visible !important;
}

body.profile-page .profile-pic img {
    position: relative !important;
    z-index: 1 !important;

    border: none !important;
}

body.profile-page .profile-pic::after {
    content: "";

    position: absolute;
    inset: -12px;

    background-image:
        url('https://i.ibb.co/3YrCH76X/6666bdb630e6ede8e805a0c29c5adcc5.gif');

    background-size: 100% 100%;
    background-position: center;
    background-repeat: no-repeat;

    z-index: 2;
    pointer-events: none;
}


/* ==========================================
   15. STICKERS
   ========================================== */

/* ABOUT ME */

body.profile-page .blurbs::before {
    content: "";

    position: absolute;
    width: 65px;
    height: 65px;

    top: -15px;
    right: -12px;

    background:
        url('https://i.ibb.co/1GPS9S08/514-Sem-T-tulo-20261030000136.png')
        center / contain no-repeat;

    z-index: 5;
    pointer-events: none;
}


/* INTERESTS */

body.profile-page .table-section::before {
    content: "";

    position: absolute;
    width: 65px;
    height: 65px;

    bottom: -12px;
    left: -12px;

    background:
        url('https://i.ibb.co/C5tSgDyH/514-Sem-T-tulo-20261030000126.png')
        center / contain no-repeat;

    z-index: 5;
    pointer-events: none;
}


/* CONTACT */

body.profile-page .contact::before {
    content: "";

    position: absolute;
    width: 65px;
    height: 65px;

    top: -15px;
    right: -12px;

    background:
        url('https://i.ibb.co/1YWZCGk1/514-Sem-T-tulo-20261030000115.png')
        center / contain no-repeat;

    z-index: 5;
    pointer-events: none;
}


/* MY FRIENDS */

body.profile-page .friends::before {
    content: "";

    position: absolute;
    width: 65px;
    height: 65px;

    bottom: -12px;
    right: -12px;

    background:
        url('https://i.ibb.co/27JZN3Kk/514-Sem-T-tulo-20261030000052.png')
        center / contain no-repeat;

    z-index: 5;
    pointer-events: none;
}


/* TUNES */

body.profile-page .profile-playlist-widget::before {
    content: "";

    position: absolute;
    width: 65px;
    height: 65px;

    top: -12px;
    left: -12px;

    background:
        url('https://i.ibb.co/wFNLDjWz/52add512891e2c3eb4770bdd4932977d.jpg')
        center / contain no-repeat;

    z-index: 5;
    pointer-events: none;
}


/* ==========================================
   16. DIVISORES
   ========================================== */

body.profile-page .blurbs::after,
body.profile-page .contact::after,
body.profile-page .friends::after {

    content: "";

    display: block;
    width: 100%;
    height: 25px;

    margin-top: 12px;

    background:
        url('https://i.ibb.co/WmbhFhY/514-Sem-T-tulo-20261029235356.png')
        center / contain repeat-x;

    pointer-events: none;
}

body.profile-page .table-section::after,
body.profile-page .profile-playlist-widget::after,
body.profile-page #comments::after {

    content: "";

    display: block;
    width: 100%;
    height: 25px;

    margin-top: 12px;

    background:
        url('https://i.ibb.co/qMWw8TBd/763e7a7c30ec67015492d3e4a0cca612.jpg')
        center / contain repeat-x;

    pointer-events: none;
}


/* ==========================================
   17. DETALHES DOS INTERESSES
   ========================================== */

body.profile-page .details-table td:first-child {
    background: var(--blue) !important;
    color: var(--pink) !important;
    font-weight: 800 !important;
}

body.profile-page .interest-content {
    color: var(--yellow) !important;
}


/* ==========================================
   18. AMIGOS
   ========================================== */

body.profile-page .friends-grid img {
    border: 2px solid var(--pink) !important;
    border-radius: 7px !important;

    transition: transform 0.3s ease !important;
}

body.profile-page .friends-grid img:hover {
    transform: scale(1.08) !important;
}


/* ==========================================
   19. MUSIC / TUNES
   ========================================== */

body.profile-page .profile-playlist-widget h3 {
    color: var(--yellow) !important;
    font-family: 'Silkscreen', monospace !important;
}

body.profile-page .profile-playlist-widget li.current .song-info {
    color: var(--pink) !important;
}

body.profile-page .pp-equalizer span {
    background: var(--red) !important;
}


/* ==========================================
   FIM - NYAN CAT GALAXY
   ========================================== */
</style><style>

/* REMOVER STICKER DA PARTE DE MÚSICAS */

body.profile-page .profile-playlist-widget::before,
body.profile-page .profile-playlist-widget::after {
    content: none !important;
    display: none !important;
    background: none !important;
}
</style>