Hatsune Sakura Miku Layout(🌸´◡`🌸)

Tags: pink, simple, hastune miku, vocaloid

Description:

Pink Salura Miku layout with Pinocchio-P's song Magical Girl and Chocolate. It's all pink and stuff with some Sakura Miku gifs. It is really simple imo, it's my first ever layout. PLZ COMMENT IF UR USING OR CREDIT ME :333

Preview:

click on the image for a larger preview

Code:

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



<style>

li.active .icon { content:url('https://64.media.tumblr.com/445e26329a16f15ea182756059521168/9ee3db4b81776661-4b/s75x75_c1/3817ac702539a58239bc0b83f05e46daa5cd182d.gifv'); width: 20PX;height: 20px;}

.logo {

content:url("https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/eadd9cc8-cea6-4c18-a983-c941e8689e7f/d60qnli-7dac5c30-be73-4530-9c9b-b9befa67bd65.png?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcL2VhZGQ5Y2M4LWNlYTYtNGMxOC1hOTgzLWM5NDFlODY4OWU3ZlwvZDYwcW5saS03ZGFjNWMzMC1iZTczLTQ1MzAtOWM5Yi1iOWJlZmE2N2JkNjUucG5nIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.vqqe3ILLNl5aGWCHvKNukyFhVXi3dj8utvFwyIYfRzg");

}


<style>
@import url('https://fonts.googleapis.com/css2?family=Jost&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nerko+One&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Moirai+One&display=swap');

p{
font-family: 'Jost', sans-serif;
font-size: 132%;
color: rgb(71, 53, 61);

}
h1,h2,h3,h4{
font-family: 'Moirai One', cursive;
font-size: 220%
} 
h5{
  font-family: 'Nerko One', cursive;
  font-size: 200%;  
}
  body {

text-align: center;

}
body{
background-image:url(https://i.pinimg.com/originals/3d/68/f8/3d68f87c3dae2797a3378178c798d16b.gif);
height: 100%;
background-position: center;
background-attachment: fixed;
background-repeat: no-repeat;
background-size: cover;

}

.profile {
   background-color: rgb(253, 235, 246); 
}
.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:#E160A5; 
text-shadow: 0 0 1px black;
background: #FFF9FD; 

}

main:before {
    width: auto;
    margin-bottom: 25px;
    border: 3px solid #F674B1;
    height: 120px;
    display: block;
    content: "";
    box-shadow: 0px 0px 5px 1px #F674C2;
    background-image: url(https://i.pinimg.com/originals/a6/26/5c/a6265c56d0d932710c24cc9d2ea8b2df.gif);
    background-position: center center;
    background-size: cover;

}
/* 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: "★"
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
/* add to favorite */
content: "✿"
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
/* send a message */
content: "↗"
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
/* foward to friend*/
content: "✧"
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
/* instant message */
content: "#"
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
/* block user */
content: "X"
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
/* add 2 group  */
content: "✪"
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
/* report */
content: "╬"

}

}
div.ah.df.dg.dh {
    border-radius: 0 0 10px 10px;
}
div.b4.ah.dx.dy.dz.e0 {
    border-radius: 10px 0 0 0;
}




/*COLOURS*/
:root {
    --light-gray: #f96cca;
    --gray: #ffbae7;
    --dark-gray: #c876b7;
    --darker-gray: #aa5e8c;
    --logo-blue: #ff009b;
    --darker-blue: #af1e68;
    --lighter-blue: #f96cca;
    --even-lighter-blue: #ffbae7 f;
    --lightest-blue: #ffbae7;
    --red: #88003d;
    --dark-orange: #88003d;
    --light-orange: #f96cca;
    --even-lighter-orange: #ffbae7;
    --strange-yellow: #db2e90;
    --green: #ffbae7;
    --light-green: #ffbae7;
    --medium-green: #ffbae7;
    --dark-green: #ffbae7;
    accent-color: #ffbae7;
    accent-color: var(--logo-blue);
}




.friends .heading{ font-size:0; }
.friends .heading:before{ content: "FRIENDS! o(*°▽°*)o "; font-size:.8rem; font-weight:bold; 
color:pink; } 
}
.friends#comments .heading{ font-size:0; }
.friends#comments .heading:before{ content: "（￣︶￣）↗　!"; font-size:.8rem; font-weight:bold;
color:pink; } 
}
.profile .table-section .heading h4 { font-size:0; }
.profile .table-section .heading h4:before{ content: "(✿◡‿◡)"; font-size:.8rem; font-weight:bold; 
color:pink; }
}
.contact .heading{ font-size:0; }
.contact .heading:before{ content: (≧▽≦)"; font-size:.8rem; font-weight:bold; 
color:pink; }
}
.blurbs .heading{ font-size:0; }
.blurbs .heading:before{ content: "(𝗼˳★)？"; font-size:.8rem; font-weight:bold; color:pink; 
}
.profile .friends{
text-align: center;
}
.profile .comments-table td{
background-color: transparent;
}
.comments-table img,
.person img{
border-radius: 15px;
box-shadow: 1px 1px 2px #B95885;
filter: opacity(98%);
opacity: .5;
}
}



.col, main, footer, nav::before, .online, nav .links, nav .top {

animation: float 4s;

animation-iteration-count: infinite;

animation-timing-function: ease-in-out;

}



.col, main, footer, nav::before, .online, nav .links, nav .top {

animation: float 4s;

animation-iteration-count: infinite;

animation-timing-function: ease-in-out;

}

@keyframes float {

0% { transform: translate(0, 0px);

}

50% {

transform: translate(0, 8px);

}

100% {

transform: translate(0, -0px);

}








img:hover , .url-info:hover , .online:hover {

  animation: shake 1s;

  animation-iteration-count: infinite;

}





@keyframes glowrainbow{
  0%{
    box-shadow: 0 0 5em 2em var(--red);
  }
  16%{
    box-shadow:0 0 5em 2em var(--orange);
  }
  32%{
    box-shadow: 0 0 5em 2em var(--yellow);
  }
  48%{
    box-shadow: 0 0 5em 2em var(--green);
  }
  64%{
    box-shadow: 0 0 5em 2em var(--cyan);
  }
  80%{
    box-shadow: 0 0 5em 2em var(--purple);
  }
  90%{
    box-shadow: 0 0 5em 2em var(--pink);
  }
  100%{
    box-shadow:0 0 5em 2em var(--red);
  }
}

body &gt; .container{
  animation:30s glowrainbow infinite;
}
.person:hover {
  animation: shake 2.0s;
  animation-iteration-count: infinite;
}
@keyframes shake {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-3px, 0px) rotate(1deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-1deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}
@keyframes rotation {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(359deg);
  }
}
@keyframes fadeIn {
   0% {opacity: 0;}
   100% {opacity: 1;}

}

.profile-pic {
    background: #fff;
    padding: 5px 5px 196px;
    box-shadow: 3px 3px 10px silver;}
.player {
  opacity: 0;
  left: 0;
  bottom: 0;
}
.player:hover {
  opacity: 100%;
  transition: 0.3s;
}





.online { visibility: hidden; } .profileUserInfo { background: url('http://www.myspacegens.com/images/online_now/111.gif') no-repeat 0 55px; height: 75px; }"); 
animation-name: none; visibility: visible; height: 25px; width: 25px; color: orange; }

}

/* ===== Scrollbar CSS ===== */
  /* Firefox */
  * {
    scrollbar-width: none;
    scrollbar-color: #3A2C33#F07BAA;
  }

  /* Chrome, Edge, and Safari */
  *::-webkit-scrollbar {
    width: 19px;
  }

  *::-webkit-scrollbar-track {
    background: #F07BB2;
  }

  *::-webkit-scrollbar-thumb {
    background-color: #3A2C30;
    border-radius: 14px;
    border: 3px ridge #FF8AC5;
  }

HTML,BODY{cursor: 
url(https://i.pinimg.com/564x/40/08/54/4008547f0f5453f17315f0ca4369198d.jpg),
auto;}


A:hover{cursor: 
url(https://i.pinimg.com/564x/40/08/54/4008547f0f5453f17315f0ca4369198d.jpg),
auto;}




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


<div style="float: ; max-height: 400px; position: fixed; right: 1px; bottom: 1px; z-index: 200;"><img src="https://i.pinimg.com/originals/48/ac/86/48ac865a63862d680ed6d5394e693059.png" width="400" height="550"/>

<style></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 )

🌸Cherri Blossom 🌸	1729112128 using! Report Comment
Gwen ★	1728719415 using Report Comment
Gwen ★	1728719414 using Report Comment
Steja :3!!!	1728667187 USINGG!!! Report Comment
MageFights	1728068999 Using!!! Report Comment
Vince! <3	1727292565 USING!!!!! Report Comment
Steja :3!!!	1727109274 USINGGG!!!! Report Comment
Gurtie *ੈ✩‧₊˚	1726578136 using thx u:3 Report Comment
Satoruhater97	1725629108 using Report Comment
୧﹒nini﹕🌸	1725596084 using<33 Report Comment
e14ine !!!	1725263423 using ! Report Comment using! by Sugar_cokexx; 1729017571; Report
no1ivantillfanreal	1725193384 using!!!! Report Comment
REAL TAKASHI	1725028050 usingggg Report Comment
𝘊𝘰𝘯𝘴	1723830782 ¡Usando! Report Comment
fia	1723420311 using Report Comment
◞	1723381042 Using Report Comment
◞	1723381041 Using Report Comment
Am1_.F4n!	1723066625 USING 🗣️‼️ Report Comment
pinkbladekiller	1723064629 using :p Report Comment
Anna!!	1722953784 Using!! Report Comment