Kokomi / Jellyfish Layout!!

Tags: uremoboyfie, genshin, kokomi, jellyfish, softcore, pastel, kawaii, pink, sangonomiya kokomi, genshin impact

Description:

a pastel layout inspire by Kokomi includes: floting page animation, heart pfp, custom cursor, autoplayer with genshin impact ost, spotify embeds, bonus header + image box, custom pixel icons + so much more !! please keep my credits in the code!! <3 check out uremoboyfie 4 more

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by Kyle or something  (https://layouts.spacehey.com/layout?id=89275) -->

<style>main:before {width: 100%;height: 200px;display: block;content: "";background-image: url(https://i.pinimg.com/originals/d1/75/8e/d1758e9842d503520da7575b7429d0d5.gif);background-position: center center;background-size: cover;}@media only screen and (max-width: 600px) {main:before{height: 200px;}}</style>



<style>
.general-about img {-webkit-mask-image: url(https://uvassociates.in/sites/default/files/images/clip-arts/3d-Peach-Love-Heart-Transparent-Background.png);-webkit-mask-size: 100%;-webkit-mask-repeat: no-repeat;-webkit-mask-position: top;}
</style>



<style>
 .logo {
 
 content:url("https://cdn.discordapp.com/attachments/920463473199153162/1174111624966185040/Spacehey_Logo.png?ex=656667a9&is=6553f2a9&hm=c82181588968d82ee0b088865c1053f2916f2819fd87929a300e47963a85d2b2&");
    }
</style>


<div class="about"> 
Made by Frankie ☆ Iero
about me goes here!!

</div>

<div>
<h3>music keeps me sane…:</h3>
<!-- spotify embed here -->

<!-- put a yt id here for autoplay music -->

<iframe width="0" height="0" src="https://www.youtube.com/embed/g-isCXcY974//?&;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>
</div>
  
  
<style>
        .online{content:url(https://64.media.tumblr.com/f5e6cc3836f236ff337e9f3bc3002d1d/fc195eab02d4bd0d-82/s75x75_c1/d6125c7bbc3d27dbd687c7c7f9916c611496aa2f.gifv) }
    </style>


<style>
    body {
          background-image:url(https://i.pinimg.com/564x/23/9c/46/239c46476d67a66143e70730c44fa51e.jpg)
   }

body { cursor: url(https://64.media.tumblr.com/3a4062a9e9c1d2bbb795f044813e72c9/eb7088c9bc9a98b3-7c/s75x75_c1/8571491f34d15c79324789f17fef14034d2d6c52.gifv), auto; }
</style>

<style>
.profile-info{
background: url(https://i.pinimg.com/564x/0d/6e/11/0d6e11c2cb88d437752008bacecda4c4.jpg);
no-repeat fixed;
    background-size: cover;
    height: 155px;
    border: white;
    font-size: 0;
    background-size: cover;
    height: 152px;
    border: white;
    font-size: 0;
    background-position-y: center;
  border-radius: 25px;
}

    .profile {
       
 color: white;
background:url(https://i.pinimg.com/564x/bf/aa/95/bfaa954f8db3a73593b3f6365c629316.jpg);
color:white;
text-shadow: 0 0 9px #FF48A6;
 </style> 

<style>
.profile .contact, .profile .table-section, .profile .url-info, .profile .friends, .profile .blurbs, table.comments-table, DIV.blog-preview { 
  border-style:Double; 
 border-width:6px; 
 border-color:=white; 
  border-radius: 25px;
background: #D5E4FF;
color: white;
}

/* contact icons */
.contact .inner a img {
font-size: 0;
color: white;
}
.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://64.media.tumblr.com/3a4062a9e9c1d2bbb795f044813e72c9/989650c73fe07925-ec/s75x75_c1/9e5f3c2ab9ab9133a444c6447bd72b224ef1508d.gifv);
color:White;
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
/* add to favorite */
content:url(https://64.media.tumblr.com/fd3767da89018e662889933474b29432/989650c73fe07925-5f/s75x75_c1/cb727de69e867628c3522557c8f72e9313244c05.gifv);

}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
/* send a message */
content:url(https://64.media.tumblr.com/f05783bd5a2e5d7f0c89617e2d972cad/989650c73fe07925-f7/s75x75_c1/38417def3f66a72136284145f82ba595288ce5ad.gifv);
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
/* foward to friend*/
content:url(https://64.media.tumblr.com/1c5809f562f11cd0ecb5aa84ed25a13d/5f59c42bf1a95f15-b8/s75x75_c1/ebe31b08f28dab8d9a52608327777b3910830947.gifv);
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
/* instant message */
content:url(https://64.media.tumblr.com/6e9493935ea7e8cbd86766c5ff648701/989650c73fe07925-50/s75x75_c1/7af20805b1ff264cb64f2faac49c595fcdaa80cf.gifv);
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
/* block user */
content:url(https://64.media.tumblr.com/dce6cbb6da955120f96d6a34a930712a/08c39938cd58adf9-0c/s75x75_c1/ccc28fa1933ba1be0b484d852711a95a85f260ee.gifv);
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
/* add 2 group  */
content:url(https://64.media.tumblr.com/05d5c2d5eb6764f9d0f80a073ff20a91/fc195eab02d4bd0d-68/s75x75_c1/62fde2c68339f57870e12a5156cdfff7ecb9832a.gifv);
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
/* report */
content:url(https://64.media.tumblr.com/db55b028950ccc02443c58705d88068d/fc195eab02d4bd0d-02/s75x75_c1/c728940ed45911d4fd9a04d1301137454b177199.gifv);

}
footer {
border-radius: 15px;
background-image: 
url(https://i.pinimg.com/564x/55/55/22/555522946360ebeae3fafabc5d6b060a.jpg);
color:White; 
}
  

nav .top {
        background: url(https://i.pinimg.com/564x/f3/b8/e4/f3b8e49eed8490ec0badd61aa77bfb46.jpg);
    }
    
    nav { background: black url(""); }

:root {
--logo-blue:#FFFFFF;
--darker-blue: #FFFFFF;
--lighter-blue: #D5E4FF;
--even-lighter-blue: url(https://i.pinimg.com/564x/77/06/68/77066819d70a4aae824e8f9005176d80.jpg);
--lightest-blue:#D5E4FF;
--dark-orange:#FFFFFF;
--light-orange:#D5E4FF;
--even-lighter-orange:#D5E4FF;
--green: #FF48A6;
}
</style>

<style>
.friends .heading{ font-size:0; }
.friends .heading:before{ content: "fellow undead "; font-size:.8rem; font-weight:bold; 
color:black; }
}
</style>
<style>
.friends#comments .heading{ font-size:0; }
.friends#comments .heading:before{ content: ""; font-size:.8rem; font-weight:bold;
color:White; } 
</style>
<style>
 .profile .table-section .heading h4 { font-size:0; }
.profile .table-section .heading h4:before{ content: "more!!"; font-size:.8rem; font-weight:bold; 
color:White; }
 </style>
<style>
    .contact .heading{ font-size:0; }
.contact .heading:before{ content: "i don't bite!! (mostly)"; font-size:.8rem; font-weight:bold; 
color:White; }
}</style>
<style>
  .blurbs .heading{ font-size:0; }
.blurbs .heading:before{ content: "me!!"; font-size:.8rem; font-weight:bold; color:White; }

  
<style>
h1{
animation: type 3s steps(27);
  color: transparent;
  font-size: 7px;
  white-space: nowrap;
  overflow: hidden;
  }

@keyframes type{
  0%{
    width:0ch;
  }
  
  100%{
    width:27ch;
  }
}

@keyframes blink{
  0%{opacity:1;}
  50%{opacity:0;}
  100%{opacity:1;}
}

.col, main, footer, nav::before, .online, nav .links, nav .top {
animation: float 5s;
animation-iteration-count: infinite;
animation-timing-function: ease-in-out;
}

.col, main, footer, nav::before, .online, nav .links, nav .top {
animation: float 5s;
animation-iteration-count: infinite;
animation-timing-function: ease-in-out;
}
@keyframes float {
0% { transform: translate(0, 0px);
}
50% {
transform: translate(0, 6px);
}
100% {
transform: translate(0, -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 33 comments ( View all | Add Comment )

★𝕬𝖓𝖌𝖊𝖑𝖎𝖓𝖊★	1731989984 Using!! Report Comment
Toaster!	1731609866 Using! Report Comment
𝐚𝐮𝐫𝐨𝐫𝐚	1731487094 Using!! ^^ Report Comment
Zivy ⭒˚🪐*.🛸๋࣭ ⭑⚝	1729270297 using !! Report Comment
Zivy ⭒˚🪐*.🛸๋࣭ ⭑⚝	1729270297 using !! Report Comment
_𝑺𝒕𝒓𝒘𝒃𝒖𝒊𝒊_	1725340118 using!! :3 Report Comment
litzmintd	1723605907 using! (or smth) Report Comment
Bree ><	1722919091 USINGG Report Comment
‧˚꒰itzbrunnetza꒱༘⋆	1722868871 using:3 Report Comment
kyaru へ(。□○)へ	1722780606 thank youu, using:3 Report Comment
𝓂𝒾s𝒶 ͒ 𓇼	1721422356 usiing!! Report Comment
★𝕬𝖓𝖌𝖊𝖑𝖎𝖓𝖊★	1721273834 Love it/ using :3 Report Comment
Rowen	1719192111 definitely using, its so cute Report Comment
yuki X3	1715192962 using Report Comment
uselessflesh<3	1711106129 using :3 Report Comment
uselessflesh<3	1711106128 using :3 Report Comment
mimi	1710737281 using ^_^ Report Comment
Deviiii(n)	1710444760 usinggg! its so gorgeouss Report Comment
Absinthe	1710345613 using Report Comment
Kalif	1708233818 usandooooop Report Comment