pink kawaii layout

Tags: pink, sanrio, hello kitty, kawaii, fluttershy, mlp, pastel, rainbow, cute

Description:

includes cursor that changes while hovering, bubble overlay, hello kitty friends space, heart pfp while hovering, and rainbow image hovering

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by faewishes ⋆.ೃ࿔*:･ (https://layouts.spacehey.com/layout?id=90906) -->

<style> 
#profile {
 position: fixed;
 background-color: #ffffff;
 background-image: url('https://i.postimg.cc/6Qk2L2kn/myspace1.png');
 opacity: 100;
 z-index: 100;
 top: 0; 
 left: 0;
 width: 100vw;
 height: 100vh;
 padding: 50px 100px;
 font-size: 200%;
 overflow-y: scroll;
 transition: .2s;
}

#profile > * {
 width: 100%;
 max-width: 700px!important;
 margin: 20px auto;
 display: block;
}

#profile:target {
 opacity: 0;
 visibility: hidden;
}

#profile > ul {
 padding: 10px 50px;
 border: 5px none;
 background-color: ffffff;
 width: 2000px;
 overflow-y: auto; 
 overflow-x: none;
 height: 600px
}
</style> 

<style>
::-webkit-scrollbar {
    width: 6px;
    height: 12px;}

::-webkit-scrollbar-thumb {
    background: #FAB7C8;
    border-radius: 0px;}

::-webkit-scrollbar-thumb:hover {
    background: #EFC8F5;}

::-webkit-scrollbar-track {
    border-radius: 0px;
    background: #FFF7F8;
    width: 2px;
    border: 1px dotted hotpink;}
</style>



<style>
main:before {
	width: 100%;
	height: 250px ;
	display: block;
	content: "";
	background-image: url('https://i.pinimg.com/originals/60/74/ec/6074ecbd47e02152f83714f7d4e39271.gif');
	background-position: center center;
	background-size: cover;}

.general-about{
  position: relative;
  margin-top: 30px;}

.general-about .profile-pic::before{
  content: '';
  background: url('https://i.postimg.cc/J02pjQcH/f7bf82f4.gif') no-repeat;
  background-size: cover;
  display: block;
  width: 20px;
  height: 20px;
  z-index: 999;
  position: absolute;
  top: -0px;
  left: -5px;}

.profile-pic img {
    box-shadow: 0px 0px 20px 4px #FEE5F5;}

/*CONFETTI ANIMATION OVERLAY*/
html:before {
  animation: grain 30s steps(10) infinite;
  background-image: url(https://img1.picmix.com/output/stamp/normal/6/4/2/6/1896246_c6324.gif);
  content: "";
  height: 300%;
  opacity: .10;
  position: fixed;
  top: 0%;
  width: 300%;
  pointer-events:none;
}

* {cursor: url(https://i.postimg.cc/c49jbtv7/frame-1.png), auto !important;}
a:hover {cursor: url(https://i.postimg.cc/Bnjy9ZFr/frame-2.png), auto !important;}


  .logo {content:url("https://i.postimg.cc/tR8p3z50/kafu-chino-kawaii.png")}

.search-wrapper input[type=text] {
    background-color: #f8f2ff !important;
    border: 1px solid #EFC8F5 !important;
    color: #F99AB1 !important;
}

.blog-preview p .pinned .icon {
   content: url("https://i.postimg.cc/x1XmxGBt/2de77306f1d926519f2eb9cf93fe8b5108a59f41.gif") !important;}

.chain {
   bottom: 63%;
   font-size:0;
   left: 95%;
   position: absolute;
   pointer-events: none;
}


::selection {
   background: #fcd2ee;
   color: white;
}


.profile .left .table-section:last-child .details-table tbody tr td p a:hover img {
	opacity: 1;
	transform: scale(1.5);
	z-index: 10;
	transition: .3s;
}

.general-about .profile-pic  img:hover, .comments-table img:hover {
        transition: .2s ease;
        -webkit-mask-image: url(https://i.postimg.cc/VLtg4pf2/pngfind-com-kawaii-transparent-png-621355.png);
        -webkit-mask-size: 100%;
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-position: center;
    }

@keyframes hoverrainbow{
  from{filter:saturate(100%) hue-rotate(0deg);}
  to{filter:saturate(100%) hue-rotate(360deg);}
}

main img:hover {
  filter:saturate(100%);
  animation: 1s hoverrainbow infinite linear;
}


 .profile .blurbs .section h4 {display: none !important;}

div.col h1:before{
  background-color: #;
  border-radius: 10%;
  font-size: 15px;
  margin-left: 5px;
  padding: 5px;
  content: url(https://i.postimg.cc/3rzQP4TX/1183850gbh9qntjiw.gif);}



    main {
        background: #ffffff !important;
        border-radius: 0 0 15px 15px;}

.contact .heading{ font-size:0; }
.contact .heading:before{ content: "Ims open! I only bite on occasion :3 "; 
font-family: valentine !important;
font-size:13px; 
background: -webkit-linear-gradient(1deg, #fe5bc2, #fc287f, #ffa65c, #fff600, #98eb00, #3ac5ff, #b56ded);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
   text-shadow: none!important;
}

.contact .heading:after {
    content: url(https://i.postimg.cc/V6WGGT05/06d2daf4.gif);}

.blurbs{
border-bottom: dashed white 3px;}

.blurbs .heading{
outline: dashed white 3px;}

.friends .heading{
outline: dashed white 3px;}

.contact{
border-bottom: dashed white 3px;}

.contact .heading{
outline: dashed white 3px;}

.table-section .heading{
outline: dashed white 3px;}

.table-section{
border-bottom: dashed white 3px;}

padding: 4px;
border-bottom: dashed white 3px;}

.blog-preview h4{
outline: dashed white 3px;}

.friends-grid img {
-webkit-mask-image: url(https://i.postimg.cc/QCHR26nR/57a622d5e160e83551bea56ff47b4f49-removebg-preview.png);
-webkit-mask-size: 100%;
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center;}

.friends-grid {
text-align: center;}

/*Comments Scrollbox*/
    table.comments-table{
display: block;
height: 1400px!important;
overflow-y: scroll;}

#comments .inner:before {
  content: "";
  white-space: pre-wrap;
  display: block;
  height: 192px;
  background-image: url("https://i.postimg.cc/g0Mpf0Q5/ezgif-2-6295e503e9.gif");
  background-position: center;
  background-repeat: no-repeat;
  background-size: auto;
}

    footer {
        border-radius: 15px;
        background: #ffdddb !important;
        display: block !important;}

.table-section:nth-last-child(2) .details-table tr:nth-child(6){display:none;}



.url-info b {
background: -webkit-linear-gradient(1deg, #fe5bc2, #fc287f, #ffa65c, #fff600, #98eb00, #3ac5ff, #b56ded);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
   text-shadow: none!important;}

nav .links a {
font-family: comic sans ms !important;
font-size: 13px;
color: #C97E8C;}

nav .links li:not(:last-child)::after, footer .links li:not(:last-child)::after {
    content: " ♡ ";
    color: #C97E8C !important;}

main {
    color: #a66571;
font-family: comic sans ms !important;
font-size: 13px !important;}

.details-table td {
  background-color: #ffffff;
  color: #a66571;} 

.details-table td p {
  color: #a66571;} 

/* Gen Body Settings */
     :root {
        --light-gray: #edc8e5;
        --darker-blue: #eda4c4 !important;
        --lighter-blue: #ffffff;
        --even-lighter-blue: #ffffff;
        --lightest-blue: #ffffff;
        --dark-orange: #ffffff;
        --light-orange: #ffffff;
        --even-lighter-orange: #ffffff;
        --green: #ffffff;
        --light-green: #EFB9CB;
        --medium-green: #EFB9CB;
        --dark-green: #EFB9CB;}

    .online {
        content: url("https://i.postimg.cc/Njcr0NFt/1871521xzkwos6lm1.gif");}

.profile .blurbs .heading:before {
    content: url(https://i.postimg.cc/6pY96mLy/ad3a3ef2.gif);}

.icon {
content: url("https://i.postimg.cc/TYYd3ZBL/2084516lotocpu0fa.gif");}


.blurbs:after {
  content: "";
  white-space: pre-wrap;
  display: block;
  height: 11px;
  background-image: url('https://i.ibb.co/f4BM31Q/tumblr-inline-payodod-QWi1snh43y-250.png');
  background-repeat: round, no-repeat;
  background-size: 240px;
}

.col.left:after {
  content: "";
  white-space: pre-wrap;
  display: block;
  height: 200px;
  background-image: url(https://i.postimg.cc/05cTZcy7/ca3f8e31fab98cdff3f1b5c5660616c4.gif);
  background-repeat: no-repeat;
  background-size: 325px;
  background-position-x: center;}

.col.right:after {
  content: "";
  white-space: pre-wrap;
  display: block;
  height: 13px;
  width: 465px;
  background-image: url(https://i.postimg.cc/htXDs3HY/9df34b46df54cfea538026d44d4c8339e15d4da6.gif);
  background-repeat: round, repeat;
  background-size: 439px;
}

.mood:after {
  content: "";
  white-space: pre-wrap;
  display: block;
  height: 45px;
  background-image: url('https://i.postimg.cc/rsz0WkMr/1f9751a8c7c260cbf03c3c3ee062c2a849ced6f6.png');
  background-position-x: center;
  background-repeat: no-repeat;
  background-size: 320px;
}

.profile .url-info{display:none;}

/*Blocks default contact Icons*/
.contact .inner a img {
font-size: 0;}

/*Custom contact Gifs*/
.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {
content: URL("https://i.postimg.cc/mDv9sTmH/1083947nyd42p4xw6.gif")}

.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
content: URL("https://i.postimg.cc/Z5nqCqK6/e955c02c.gif")}

.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
content: URL("https://i.postimg.cc/C1gFWDL3/c5218a59-original.png")}

.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
content: URL("https://i.postimg.cc/fLJcV1N7/11de86cc-original.gif")}

.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
content: URL("https://i.postimg.cc/hvNdKcMm/12.webp")}

.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
content: URL("https://i.postimg.cc/rsxJ3RBK/31cb401f.gif")}

.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
content: URL("https://i.postimg.cc/pLv95KtF/a0b8e93c.png")}

.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
content: url("https://i.postimg.cc/wMQ6v7hr/b40589a0.gif")}

    .blog-preview {
  background: url(https://i.postimg.cc/CxBkjH1b/rainbow.png);
  height: 180px;
  background-position-x: center;
  background-repeat: no-repeat;}

body
{background-image: url(https://i.postimg.cc/6Qk2L2kn/myspace1.png);}


.icon {
    height: 1em;
    width: 1em;}


.details-table td:first-child {
  background: linear-gradient(#FCBDC7, #ffffff 20px);
  text-align: center;
  text-shadow: white 0px 1px 2px;
  width: 30%;
  box-shadow: #ffffffab 0px 1px 2px 2px inset;
  color: black;
  font-weight: normal;
}

.profile .contact .heading h4, .profile .table-section h4 {
  font-weight: normal;
}



.profile .contact .inner, .profile .table-section .inner {
    border: #ffa9d6 1px solid;
    
}

.profile-info {
  border: 0;
  margin: 0;
  padding: 0;
}

.profile-info h3 {
  font-weight: normal;
  color: grey;
  margin: 0;
}

.profile h1 {
  letter-spacing: 0.3px;
  margin: 0;
font-size: 16px !important;}

h1,h2,h3,h4,h5 {
font-family: valentine;}

p {
font-family: comic sans ms !important;
font-size: 13px !important;}

    .top {
        font-family: comic sans ms !important; font-size: 13px !important;}

.profile .blurbs {
        font-family: comic sans ms !important; font-size: 13px !important;}

.contact {
font-family: comic sans ms !important; font-size: 13px !important;}

    @font-face {
        font-family: valentine;
        src: url(https://dl.dropbox.com/s/ey314lzfpajst8j/Ifoundmyvalentine-GzYA.otf);}

@font-face {
    font-family: 'omekashi';
    src: url('https://dl.dropbox.com/s/0uiorxjte0uuvtw/omekashi_font.ttf');}

/* Link Settings */
.mood a, .inner a, .friends a {
 color: #eda4c4 !important;
}

footer .links a{
color: #c97e8c !important;}

.blog-preview a {
 color: #D286A7;
 font-weight: normal;
}

/* Nav Bar */
nav .links {
 background: linear-gradient(#FFCED3 15%, #ffe6f0, #FFE8E1); 
 box-shadow: white 0 1px 1px 1px inset;
 padding: 0;
 text-align: center;
}

a:hover {
     font-weight: bold !important;
     background: url(https://i.postimg.cc/ZRrSnGJD/8372d80f.gif) !important;
     text-decoration-style: wavy !important;
     font-style: italic;
     color:  #B88DE3 !important;
}



nav .links a {
  color: #C97E8C;
  text-shadow: white 0px 2px 4px;
  padding: 1px
  background: linear-gradient(#FFDADE, #FFDADE);
  text-decoration: none;
  padding-top: 0;
}

nav .links li.active a {
  color: #C97E8C; 
  font-weight: normal;
}

nav .links li:not(:last-child)::after {
  color: white;
  text-shadow: lightblue 1px 0px 1px;
}

/* Nav Top */
nav .top {
 background: linear-gradient(#FFDDDE, #FCCED0 40%, #FDC1C1); 
 box-shadow: #fff6 0px 0px 2px 3px inset;
}

/* Blurbs and Headings Settings */
.profile .blurbs .inner, .profile .friends .inner, .profile .contact .heading {
  border: 1px solid #ffa9d6;
  border-bottom: 0;
}

.profile .blurbs .heading, .profile .friends .heading, .profile .contact .heading, .profile .table-section .heading {
  background: linear-gradient(#FFDCCF 15%, #FFCCD2, #ffdddb); 
  box-shadow: white 0 1px 1px 1px inset;
  color: #a66571;
  font-weight: normal;
  text-shadow: white 0px 2px 5px;
  border: 1px solid #ffa9d6;
  border-bottom: 0;}

.profile .friends .heading h4,  .blurbs .heading h4{
 font-weight: normal;}

h4 {
background: -webkit-linear-gradient(1deg, #fe5bc2, #fc287f, #ffa65c, #fff600, #98eb00, #3ac5ff, #b56ded);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
   text-shadow: none!important;}

.profile .blurbs .section {
 color: #a66571;}

.profile .inner b {
 color: #a66571;}

.profile .inner span.count {
 color: #ffd27a; }

.profile .friends .person p {
 color: #a66571;}

.comments-table td:first-child {
  background: linear-gradient(#FFCCD2, white);
  text-align: center;
  text-shadow: white 0px 1px 2px;
  width: 30%;
  box-shadow: #ffffffab 0px 1px 2px 2px inset;}


.comments-table td {
 background-color: #ffffff;}



button:not(.logout-btn) {
 background: linear-gradient(#FFDCCF 15%, #FCBDC7, #ffcfd7); 
 box-shadow: white 0 1px 1px 1px inset;
 color: #a66571;
 font-family: comic sans ms;
 font-weight: normal;
 text-shadow: white 0px 2px 5px;
 border: 1px solid #bd7e8a;
 border-radius: 2px;
 padding: 2px;} 

button:not(.logout-btn):hover {
 background: linear-gradient(#ffefcc, #FFCFD7); 
 box-shadow: white 0 1px 1px 1px inset;
 color: #a66571;
 font-weight: normal;
 text-shadow: white 0px 2px 5px;
 border: 1px solid #bd7e8a;
 border-radius: 2px;
 padding: 2px;} 
</style>

<div style="float:  ; max-height: 400px; position: fixed; right: 1px; bottom: 9px; z-index: 200;"><img src="https://i.postimg.cc/wv99p4Sw/Ozw1RWP.gif" width="110" height="102"/></div>

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

liarandhislover	1756766749 using Report Comment
watching u <3	1756149928 using!!! Report Comment
isla	1754906533 Using Report Comment
⌗!! ꒰ Minnie ꒱ 🍰	1752664015 using :3!! Report Comment
Luca 🧁	1751166614 Using Report Comment
shawnteee ^^	1749331450 using! Report Comment
ella🍂	1743615086 using Report Comment
🌈*.CRISIIISFUWA☆𝑱𝑶𝒀𝒀𝒀‼️🍭	1736849980 HOW DO I GET ONLYY THW BANNERRR ?!??! :3333 :DD >w< Report Comment
kare	1735317642 using friends hello kitty friend overlay! Report Comment
RawrM3ow🩹🧁	1731875934 Using!! Report Comment
pixel_laniCAT	1731279821 using Report Comment
MAYA ♥︎	1721761109 using :3 Report Comment
anaye	1721506212 using Report Comment
Kiann <3	1721267227 Usingg Report Comment
basil ⋅˚₊‧𐙚	1720719852 using:3 thank you!! Report Comment
River!!	1718321056 Using Report Comment
Flor Mística	1715402328 using!!!!!!!!!!!!! XD Report Comment
♯ SAOIRSE	1711802942 using ＼(≧▽≦)／ Report Comment
𝜗𝜚 ┈ MELY / ELY	1710470304 Using!!! Report Comment
𝔰𝔱𝔢𝔩𝔩𝔞🦇	1710464076 hey! could i get the code for just the heart pfp? Report Comment