Pink Cherry Blossom Cat Layout!

Tags: pink, cat, kawaii, simple, cherry blossom, kitten, animation, autoplay, cute

Description:

Includes: Music autoplay, cat loading screen, cherry blossom overlay, cat cursor, online blinkie status, circular pfp and friend pfps, transparent nav bar/links, etc! Anyone can use just let me know in the comments :3

Preview:

click on the image for a larger preview

Code:

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

<style>

/*GRADIENT HEADINGS+BORDERS*/
.profile .table-section, .profile .url-info, .profile .contact {
    border: 2px solid white;
border-radius: 5px;
box-shadow: 0px 0px 7px 5px #ff61a8;
}
.profile .table-section .heading, .profile .contact .heading {
   color: white;
   text-shadow: -1px 1px 1px pink;
   background: linear-gradient(#ff61a8, white);
   border-bottom: 2px solid white;
   border-radius: 5px;
}
.profile .blurbs .heading, .profile .friends .heading{
   color: white;
   text-shadow: -1px 1px 1px white;
   background: linear-gradient(#ff61a8, white);
   border: 2px solid white;
   border-radius: 5px;}

/*HEADINGS FONT*/
@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap');
   h1, h2, h3, h4{font-family: 'Press Start 2P', cursive;
   color: white;
   text-shadow: 2px 2px 3px #FFFFFF, 0 0 25px #c167b5, 0 0 5px #FFFFFF}

/*BODY FONT*/
@import url('https://fonts.googleapis.com/css2?family=Cedarville+Cursive&display=swap');
   .table-section td, body{font-family: 'Cedarville Cursive', cursive;
   color: white;
   text-shadow: 2px 2px 3px #FFFFFF, 0 0 25px #FFFFFF, 0 0 5px white;}

/*BODY TEXT SETTINGS*/
main p{
    letter-spacing: 2px;
    font-weight: 700; 
    line-height: 1.5;}

/*FONT COLOURS*/
p{color: white}
.count {color: white}
.profile .blurbs .section h4{color: #ff61c2}
.contact a{color: white}
.mood a, .mood p, .mood{#ff61c2}

/*VERY BACK BACKGROUND*/
body{
   background: url(https://i.ibb.co/Mf3h7g2/XaeHmEy.gif);  
   background-size: 50%}

/*PROFILE BCKGROUND*/
.profile{
   background-image: url(https://i.ibb.co/hmrdgSh/uS7w1Am.gif);
   background-size: 100%;
   border-radius: 12px;
   box-shadow: 0px 0px 9px 7px #ff61a8;
   color: white}

/*FOOTER*/
footer {
border-radius: 15px;
background-image: url(https://i.ibb.co/0Fhmx4k/XvI21K4.gif);
background-size: 50%;
box-shadow: 0px 0px 9px 7px #ff61a8}

/*CIRCULAR PFP*/
.profile-pic {
   border-radius: 500px;
   overflow: hidden;
   box-shadow: 0px 0px 7px 5px white}

/*TOP BAR*/
.top{
   background:  !important;
   background-image: url("https://i.ibb.co/BNHZ0j0/9u7dMUp.gif") !important;
   background-size: cover !important;
   border-radius: 15px;
   box-shadow: 0px 0px 9px 7px #ff61a8}

/*LOGO*/
.logo{ 
   filter: sepia(100%) hue-rotate(200deg) saturate(100);
   box-shadow: 0px 0px 7px 5px pink}

/*TRANSPARENT NAV BAR*/
.links{opacity: 0.01}

/*FRIENDS NAMES COLOUR*/
.friends-grid a{color: #ff61a8}

/*FRIENDS BACKGROUND*/
.friends{
   background-image: url(https://i.ibb.co/YRH3nh3/Z3V70wm.gif);
   border-style:Double; 
   border-width:6px; 
   border-radius: 5px;
   border-color: white}

/*TRANSPARENT INTERESTS GRID*/
:root{
   --even-lighter-blue: pink, opacity:0.01;
   --lightest-blue: pink, opacity:0.01;

/*FRIENDS-GRID*/
--light-orange: linear-gradient(#ff61a8, white);
--even-lighter-orange: linear-gradient(#ff61a8, white)}

.friends-grid img{ 
 border-radius: 500px;
   overflow: hidden;
   box-shadow: 0px 0px 7px 5px white}

/*DOUBLE BORDERS*/
.profile .contact, .profile .table-section,
   DIV.blog-preview{ 
   border-style: Double;
   border-radius: 5px; 
   border-width:6px; 
   border-color: white; 
   text-shadow: 0 0 9px white;
   linear-gradient(#ff61a8, white)}

/*ONLINE*/
.online{content: url(https://i.ibb.co/WHXfn3W/eIIMNl7.gif)}

/*IMAGE ABOVE BLURBS*/
.profile-info {
   font-size: 0px;
   border: 4px dashed #FFFFFF;
   border-radius: 5px;
   background: url(https://i.ibb.co/km8PD0L/Ij5bz3f.gif);
   width: cover!important;
   position: centre;
   height: 130px;
   box-shadow: 0px 0px 7px 5px #ff61a8}

/*CONTACT ICONS*/
.contact .inner a img {
font-size: 0;
}
.contact .inner a img:before {
font-size: 1em;
display: block
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {
/* add to friends */
content: url("https://i.ibb.co/KXVwDyv/SPutgDg.gif")
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
/* add to favorite */
content: url("https://i.ibb.co/KXVwDyv/SPutgDg.gif")
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
/* send a message */
content: url("https://i.ibb.co/KXVwDyv/SPutgDg.gif")
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
/* foward to friend*/
content: url("https://i.ibb.co/KXVwDyv/SPutgDg.gif")
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
/* instant message */
content: url("https://i.ibb.co/KXVwDyv/SPutgDg.gif")
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
/* block user */
content: url("https://i.ibb.co/KXVwDyv/SPutgDg.gif")
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
/* add 2 group  */
content: url("https://i.ibb.co/KXVwDyv/SPutgDg.gif")
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
/* report */
content: url("https://i.ibb.co/KXVwDyv/SPutgDg.gif")}

/*LINK COLOURS*/
a{
   color: white !important;}
a:hover{
    color: #ff61a8 !important;}
a:visited{
    color: white !important;}
    
.top a{
    color: white !important;}
.top a:hover{
    color: #ff61a8 !important;}
.top a:visited{
    color: white !important;}
    
.links a{
    color: white !important;}
.links a:hover{
    color: #ff61a8 !important;}
.links a:visited{
    color: white !important;}
   
.friends-grid p{
    color: white !important;}

footer .links a{
    color: white !important;}
footer .links a:hover{
    color: #ff61a8 !important;}
footer .links a:visited{
    color: white !important;}

/*SAKURA BLOSSOM ANIMATION OVERLAY*/
html:before {
  animation: grain 8s steps(10) infinite;
  background-image: url(https://i.ibb.co/wyvnsYb/NaDPdZJ.gif);
  content: "";
  height: 200%;
  left: -50%;
  opacity:.5;
  position: fixed;
  top: -110%;
  width: 200%;
  pointer-events:none;}

/*CAT CURSOR*/
*{cursor: url(http://www.rw-designer.com/cursor-extern.php?id=128573), auto !important}

/*LINKS ICONS*/
  .icon, .award img {
        content: url(https://i.ibb.co/KXVwDyv/SPutgDg.gif);
        display: inline-block;
        height: 2.0em;
        width: 2.0em;
        margin: 0 .05em 0 .1em;
        vertical-align: -0.3em;
        color: rgba(0,0,0,0);}

/*TRANSPARENT FOOTER LINKS*/
footer .links {
   background: rgba(0, 0, 0, 0);
   border: 0px;}
.inner {color: #fffFFF;}

/*BUTTONS*/
button {
   color: #fff;
   background: #000 url(https://i.ibb.co/68Zy9Gk/l19p5xL.gif); 
   border: 2px solid #FFFFFF;}
button:hover {
   color: #FFFFFF;
   background: #ff0000;}

/*TOP SEARCH BAR*/
  .search-wrapper input[type=text] {
    background-color: #ff61a8 !important;
    border: 1px dotted white var(--headers) !important;
    border-radius: 10px !important}
 button{
    border-radius: 10px !important;
    border: 1px dotted var(--headers) !important;
    background-color: #ff61a8 !important;
    color:var(--headers) !important}

/*loading page!*/
body:before {
	content: " ";
	height: 100vh;
	width: 100vw;
	display: block;
	position: fixed; 
	top: 0; 
	left: 0; 
	z-index: 100;
	background-image: url('https://i.ibb.co/5cvkHGw/qPbUlcu.gif');
	background-size: 40%;
	background-repeat: repeat;
    background-position:center;
    background-color: black;
	animation: yourAnimation 2s ease 0s 1 normal forwards;
	pointer-events: none;
}
@keyframes yourAnimation { 0.0%{ opacity: 1;} 75%{ opacity: 1; } 100%{ opacity: 0;} }  

/*SONG AUTOPLAY - to change the song, copy in the link AFTER THE = SIGN of any youtube video into the spot after the /embed/and before the slashes*/
</style>

<iframe width="0" height="0" src="https://www.youtube.com/embed/cwyTleTL06Y//?&;amp;;autoplay=1&;loop=infinite&;controls=1" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" loading="lazy">

</iframe>

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 71 comments ( View all | Add Comment )

eli/elliot🎀	1761147750 using!! Report Comment
Emii Emii	1760926593 using!! Report Comment
Elle <3	1759973927 using!!! for ramble blogs! Report Comment
dash	1759406145 using the loading screen its cute !! Report Comment
polly⚯ ͛🪄	1758948407 using Report Comment
🐰Bunbun🐰	1758888953 Using!!! ♡ Report Comment
Catie!!! (˶˃⤙˂˶)	1757556189 woah... using!! :33 Report Comment
𝒱𝑒𝒶𝒽 ♬⋆.˚	1754949585 using!! Report Comment
GLINDA	1754641736 Using Report Comment
blairblood	1754085021 using!💗 Report Comment
bUn.iiᓚᘏᗢ	1751061425 usinggg :3 Report Comment
L0v3LyL1Vy	1748388074 using ty !! :> Report Comment
Gilmix ☘	1747877449 Using ✌️ Report Comment
Zia	1746731405 usingg Report Comment
Arora Star	1743561105 (´▽`ʃ♡ƪ) soo cute! Using. XOxo Report Comment
Athena	1742917161 Using :33 Report Comment
Roz >w<	1742667105 Using :3 Report Comment
Roz >w<	1742667094 Using :3 Report Comment
sawako-chan>>	1742066579 using! Report Comment
MiuMau Luv	1739913154 usinggg Report Comment