nyan cat layout!!

Tags: nyan cat, simple

Description:

nyan cat layout!!!!! includes: scrolling friends, falling Nyan cats (snowflake), and nyan cant intro :3 *finally updated 2 work :)* enjoy!!

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by kels (https://layouts.spacehey.com/layout?id=27152) -->

<div class="snowflakes">
<div class="snowflake"><img src="https://files.catbox.moe/zqomdx.png"/></div>
<div class="snowflake"><img src="https://files.catbox.moe/zqomdx.png"/></div>
<div class="snowflake"><img src="https://files.catbox.moe/zqomdx.png"/></div>
<div class="snowflake"><img src="https://files.catbox.moe/zqomdx.png"/></div>
<div class="snowflake"><img src="https://files.catbox.moe/zqomdx.png"/></div>
<div class="snowflake"><img src="https://files.catbox.moe/zqomdx.png"/></div>
<div class="snowflake"><img src="https://files.catbox.moe/zqomdx.png"/></div>
</div>

<style>
    @-webkit-keyframes snowflakes-fall{0%{top:-10%}100%{top:100%}}@-webkit-keyframes snowflakes-shake{0%,100%{-webkit-transform:translateX(0);transform:translateX(0)}50%{-webkit-transform:translateX(80px);transform:translateX(80px)}}@keyframes snowflakes-fall{0%{top:-10%}100%{top:100%}}@keyframes snowflakes-shake{0%,100%{transform:translateX(0)}50%{transform:translateX(80px)}}.snowflake{position:fixed;top:-10%;z-index:9999;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default;-webkit-animation-name:snowflakes-fall,snowflakes-shake;-webkit-animation-duration:10s,3s;-webkit-animation-timing-function:linear,ease-in-out;-webkit-animation-iteration-count:infinite,infinite;-webkit-animation-play-state:running,running;animation-name:snowflakes-fall,snowflakes-shake;animation-duration:10s,3s;animation-timing-function:linear,ease-in-out;animation-iteration-count:infinite,infinite;animation-play-state:running,running}.snowflake:nth-of-type(0){left:1%;-webkit-animation-delay:0s,0s;animation-delay:0s,0s}.snowflake:nth-of-type(1){left:10%;-webkit-animation-delay:1s,1s;animation-delay:1s,1s}.snowflake:nth-of-type(2){left:20%;-webkit-animation-delay:6s,.5s;animation-delay:6s,.5s}.snowflake:nth-of-type(3){left:30%;-webkit-animation-delay:4s,2s;animation-delay:4s,2s}.snowflake:nth-of-type(4){left:40%;-webkit-animation-delay:2s,2s;animation-delay:2s,2s}.snowflake:nth-of-type(5){left:50%;-webkit-animation-delay:8s,3s;animation-delay:8s,3s}.snowflake:nth-of-type(6){left:60%;-webkit-animation-delay:6s,2s;animation-delay:6s,2s}.snowflake:nth-of-type(7){left:70%;-webkit-animation-delay:2.5s,1s;animation-delay:2.5s,1s}.snowflake:nth-of-type(8){left:80%;-webkit-animation-delay:1s,0s;animation-delay:1s,0s}.snowflake:nth-of-type(9){left:90%;-webkit-animation-delay:3s,1.5s;animation-delay:3s,1.5s}.snowflake:nth-of-type(10){left:25%;-webkit-animation-delay:2s,0s;animation-delay:2s,0s}.snowflake:nth-of-type(11){left:65%;-webkit-animation-delay:4s,2.5s;animation-delay:4s,2.5s}



</style>
<style>
 
  body {
   background-image: url(https://files.catbox.moe/iy05kt.gif);
</style>

<style>
body:before {

content: " ";
height: 100vh;
width: 100vw;
display: block;
position: fixed; 
top: 0; 
left: 0; 
z-index: 100;
background-image: url('https://i0.wp.com/www.printmag.com/wp-content/uploads/2021/02/4cbe8d_f1ed2800a49649848102c68fc5a66e53mv2.gif?resize=476%2C280&ssl=1');
background-size: cover;
background-repeat: no-repeat;
background-position:center;
animation: yourAnimation 3s ease 0s 1 normal forwards;
pointer-events: none;

}
@keyframes yourAnimation { 0.0%{ opacity: 1;} 75%{ opacity: 1; } 100%{ opacity: 0;} } 
</style>

<style>
.friends-grid::before {
	width: 1000px;
	height: 80px;
	object-fit: cover;
	margin-bottom: 10px!important;
}


.friends-grid::before{
    content: "";
    display: flow-root;
    font-size: 30px;
    color: var(--lighter-blue);
    font-weight: 800;
    text-align: center !important;
    margin: 10px 300px 500px 0px;   
    position: relative;
  animation-fill-mode: forwards;
}
.friends {
border: none;
    overflow: hidden;
}

.friends-grid {
  position: relative;
  animation: myfirst 15s linear infinite;
  animation-fill-mode: forwards;
}
 
@keyframes myfirst {
0% {left:-1550px;}
100% {left:500px;} 
}

.friends-grid {
	display: flex;
	flex-wrap: nowrap;
}
</style>

<style>
        .profile{
        
    direction: rtl;
    
    }
    .blurbs{
    
    direction: ltr;
        
    }
    .blog-preview{
        
    direction: ltr;
        
    }
    .friends{
    
    direction: ltr;
        
    }
    .general-info{
        
    direction: ltr;
        
    }
    .contact{
        
    direction: ltr;
    
    }
    .url-info{
        
    direction: ltr;
        
    }
    .details-table{
        
    direction: ltr;
        
    }
    .profile .table-section .heading{
    
    direction: ltr;
        
    }
    .details p{

    direction: ltr;

   }
   .mood{

    direction: ltr;

   }


 :root {
        --logo-blue: #003466;
        --darker-blue: ##3c7ab5;
        --lighter-blue: #003466;
        --even-lighter-blue: #ffffff;
        --lightest-blue: #003466;
        --dark-orange: ##3c7ab5;
        --light-orange: #003466;
        --even-lighter-orange: #003466;
        --green: #003466;
    }
</style>

<style>
/* floating animations */
.profile-pic, .profile .friends .person img:not(.icon), .profile .friends .person p, .profile h1{ 
    animation-name: floating;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    margin-left: 0px;
    margin-top: 0px;
}    
</style>

Copy and paste this code into the "About me" section of your Profile to use it.

Caution: This Layout was not inspected by SpaceHey — use it at your own risk.

Comments

Displaying 20 of 41 comments ( View all | Add Comment )

Emma c:	1743441654 Usinggg Report Comment
b✶oycleric 🧩	1741665010 USING FOR THE SCROLL FRIENDS TYTY Report Comment
Strats :3	1741469598 Usingg ! Blud, tysm for Thais amazing layout. It's the best that i saw :D Report Comment
Cherib0mb.com	1741117990 how do i get just the floating nyan cats?? help plz Report Comment copy all the code up until the first (the one after the longg paragraph) and paste just that onto your profile :) sorry 4 the l8 reply!! (╥ᆺ╥；) by kels; 1741279544; Report it didn't type!! oopsies!! copy the code until you see the first < /style> (without the space ofc) by kels; 1741279628; Report
Cherib0mb.com	1741117990 how do i get just the floating nyan cats?? help plz Report Comment
dvnny	1740970135 using Report Comment
mimilikesplums	1735014949 the floating nyans dont work with others:(( Report Comment
XxLimppuxX	1734856148 Using! Report Comment
ミ★ M . ⋆˚🐾 𐂯 ˖°	1731888686 using?? is it ok if you make the same exact layout but without an intro? Report Comment
__vivixx__	1731180236 using!!!!!!!!!!!!!!!! Report Comment
ollie	1730446234 hi im using tjis i cang change it im stuckwith a 9/11 layout please please help me? please Report Comment
Bananan	1729711868 Using Report Comment
HYBR1DTH30RY	1726625323 using :) Report Comment
Rianbowgamerz:3	1724979157 making some changes but using! Report Comment
mickey!! (profile wip)	1722223910 Using Report Comment
Moña Hoishikai	1720830636 Using! Report Comment
Kaliroe Malice	1720701551 using Report Comment
fudgechocolate!	1719567451 Using! Report Comment
BUILDERMAN [ 🔨 ]	1718490822 using! Report Comment
Kitty :3 !! 🐾	1718163141 using! :D Report Comment