PINKIE LIGHTBLUE LAYOUT !!

Tags: pink, lightblue, light, simple, cute, float, light blue

Description:

eee no sé. aclaro desde ya q no soy programadora ni nada d eso, pero m salió esto y lo comparto. si t gusta comenta pls, eso nomás ♥

Preview:

click on the image for a larger preview

Code:

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

<style>
/*LAYOUT CREATED BY WORMPIGGY*/
/*all text*/
  @import url('https://fonts.googleapis.com/css2?family=Changa:wght@200..800&display=swap');
a{
    font-family: "Changa", sans-serif;
    text-align: center;
    font-weight: 600;
    color: #6890ab;
    font-size: 13px;
    text-shadow: none!important;
}
nav{
    font-family: "Changa", sans-serif;
    text-align: center;
    font-weight: 600;
    color: #6890ab;
    font-size: 13px;
    text-shadow: none!important;
}
nav .links li:not(:last-child)::after, links li:not(:last-child)::after {
    text-align: center;
    content: " ☆ ";
    color: white;
}
.links a{
    font-family: "Changa", sans-serif;
    text-align: center;
    font-weight: 600;
    color: #6890ab;
    font-size: 13px;
    text-shadow: none!important;
}
a:hover{
    background: -webkit-linear-gradient(#9cd7ff, #6890ab);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
p{
    font-family: "Changa", sans-serif;
    text-align: center!important;
    font-weight: 500;
    color: white;
    font-size: 15px;
}
.profile h1{
    text-align: center!important;
    font-family: "Changa", sans-serif;
    font-size: 27px;
}
h1{
    text-align: center!important;
    font-family: "Changa", sans-serif;
    font-weight: 900;
    color: white;
}
h2, h3, h5{
    text-align: center!important;
    font-family: "Changa", sans-serif;
    font-weight: 500;
    font-size: 18px;
    color: white;
}
h4{
    text-align: center!important;
    font-family: "Changa", sans-serif;
    font-weight: 600;
    font-size: 18px;
    text-transform: uppercase!important;
    color: #6890ab;
}
.profile, .blurbs, .section h4{
    text-align: center!important;
    font-family: "Changa", sans-serif;
    color: white!important;
}
.count{
    color: #6890ab;
}
button {
    background-color: transparent!important;
    border: white;
    text-align: center!important;
    font-family: "Changa", sans-serif;
    color: #6890ab!important;
}
</style>

<style>
/*body style*/
body {
  background-image: url('https://i.ibb.co/ypJ0WT8/image-1.png');
  background-size: 100%;
  background-position: left top;
  background-color: #9cd7ff;
  border: 10px solid #6890ab;
  border-radius: 15px;
}
nav img.logo {
  filter:brightness(0) saturate(100%)invert(100%) sepia(100%) saturate(0%) hue-rotate(232deg) brightness(102%) contrast(108%)!important;
}
.online img{
    filter:brightness(0) saturate(100%)invert(100%) sepia(100%) saturate(0%) hue-rotate(232deg) brightness(102%) contrast(108%)!important;
}
.online{
  color: white;
}
</style>

<style>
/*blurbs, tables etc. style*/
  main {
  background-color: transparent;
  border-radius: 15px;
  border: none;
}
nav .top{
  background: -webkit-linear-gradient(#9cd7ff, #ffd6ec)!important;
  border-radius: 15px;
  border: 5px solid #6890ab;
  margin-top: 10px;
  margin-bottom: 10px!important;
}
nav .links{
  background-color: #ffd6ec90;
  border-radius: 15px;
  border: 5px solid #6890ab;
  margin-top: 10px;
  margin-bottom: 10px!important;
}
h1{
  min-width: 304px;
  max-height: 47px;
  border-radius: 15px;
  border: 5px solid #6890ab;
  background: -webkit-linear-gradient(#9cd7ff, #ffd6ec)!important;
  margin-bottom: 10px!important;
}
.general-about .details {
  min-width: 304px;
  min-height: 171px;
  border-radius: 15px;
  border: 5px solid #6890ab;
  background: #ffd6ec90;
  margin-bottom: 10px!important;
}
.general-about .profile-pic img {
  max-width: 150px;
  max-height: 150px;
  margin: 11px 10px 10px 15px;
}
.mood{
  min-width: 304px;
  max-height: 80px;
  border-radius: 15px;
  border: 5px solid #6890ab;
  background: #ffd6ec90;
  margin-bottom: 10px!important;
}
.contact{
  border-radius: 15px 15px 15px 15px!important;
  border: 5px solid #6890ab!important;
  background: #ffd6ec90!important;
  margin-bottom: 10px!important;
}
.url-info{
  border-radius: 15px!important;
  border: 5px solid #6890ab!important;
  background: #ffd6ec90!important;
  margin-bottom: 10px!important;
}
.table-section{
  border-radius: 15px 15px 15px 15px!important;
  border: 5px solid #6890ab!important;
  background: #ffd6ec90!important;
  margin-bottom: 10px!important;
}
.table-section td {
  border: 1px solid #9cd7ff;
}
td{
  background-color: transparent!important;
}
.comments-table td {
  border: 1px solid #9cd7ff;
}
.profile-info {
  border-radius: 15px!important;
  border: 5px solid #6890ab!important;
  background: #ffd6ec90!important;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 15px 5px;
  margin-bottom: 10px 
}
.heading{
  border-radius: 15px!important;
  margin-bottom: 10px!important;
  background: -webkit-linear-gradient(#9cd7ff, #ffd6ec)!important;
}
.blurbs, .friends{
  border-radius: 15px 15px 15px 15px!important;
  border: 5px solid #6890ab!important;
  background: #ffd6ec90!important;
  margin-bottom: 10px!important;
}
.blog-preview{
  border-radius: 15px!important;
  border: 5px solid #6890ab!important;
  background: #ffd6ec90!important;
  margin-bottom: 10px!important;
}
footer{
  background: transparent;
}
</style>

<style>
/*filters, idk, cosas extras*/
.friends-grid .person {
  filter: saturate(0%) invert(0%) sepia(4%) saturate(3387%) hue-rotate(287deg) brightness(102%) contrast(101%);
}
.friends-grid .person img{
    mix-blend-mode: multiply;
}
.comments-table td:first-child img:not(.icon) {
filter: saturate(0%) invert(0%) sepia(4%) saturate(3387%) hue-rotate(287deg) brightness(102%) contrast(101%);
}
.comments-table td:person img:not(.icon) {
    mix-blend-mode: multiply;
}
.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: "♥︎"
}
.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: "♥︎"
}   
body::-webkit-scrollbar {
  width: 12px;               /* width of the entire scrollbar */
}

body::-webkit-scrollbar-track { ffd6ec
  background: #9cd7ff;        /* color of the tracking area */
}

body::-webkit-scrollbar-thumb {
  background-color: #ffd6ec;    /* color of the scroll thumb */
  border-radius: 20px;       /* roundness of the scroll thumb */
  border: 3px solid #ffd6ec;  /* creates padding around scroll thumb */
}
main{
animation-name: floating;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-timing-function: ease-in-out;
margin-left: 0px;
margin-top: 0px;
}
@keyframes floating {
0% { transform: translate(0, 0px); }
50% { transform: translate(0, 15px); }
100% { transform: translate(0, -0px); }
}
@import url('https://fonts.googleapis.com/css2?family=VT323&display=swap');
 {
  0% {
    opacity: 0.27861;
  }
  5% {
    opacity: 0.34769;
  }
  10% {
    opacity: 0.23604;
  }
  15% {
    opacity: 0.90626;
  }
  20% {
    opacity: 0.18128;
  }
  25% {
    opacity: 0.83891;
  }
  30% {
    opacity: 0.65583;
  }
  35% {
    opacity: 0.67807;
  }
  40% {
    opacity: 0.26559;
  }
  45% {
    opacity: 0.84693;
  }
  50% {
    opacity: 0.96019;
  }
  55% {
    opacity: 0.08594;
  }
  60% {
    opacity: 0.20313;
  }
  65% {
    opacity: 0.71988;
  }
  70% {
    opacity: 0.53455;
  }
  75% {
    opacity: 0.37288;
  }
  80% {
    opacity: 0.71428;
  }
  85% {
    opacity: 0.70419;
  }
  90% {
    opacity: 0.7003;
  }
  95% {
    opacity: 0.36108;
  }
  100% {
    opacity: 0.24387;
  }
}
@keyframes textShadow {
  0% {
    text-shadow: 0.4389924193300864px 0 1px rgba(0,30,255,0.5), -0.4389924193300864px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  }
  5% {
    text-shadow: 2.7928974010788217px 0 1px rgba(0,30,255,0.5), -2.7928974010788217px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  }
  10% {
    text-shadow: 0.02956275843481219px 0 1px rgba(0,30,255,0.5), -0.02956275843481219px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  }
  15% {
    text-shadow: 0.40218538552878136px 0 1px rgba(0,30,255,0.5), -0.40218538552878136px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  }
  20% {
    text-shadow: 3.4794037899852017px 0 1px rgba(0,30,255,0.5), -3.4794037899852017px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  }
  25% {
    text-shadow: 1.6125630401149584px 0 1px rgba(0,30,255,0.5), -1.6125630401149584px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  }
  30% {
    text-shadow: 0.7015590085143956px 0 1px rgba(0,30,255,0.5), -0.7015590085143956px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  }
  35% {
    text-shadow: 3.896914047650351px 0 1px rgba(0,30,255,0.5), -3.896914047650351px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  }
  40% {
    text-shadow: 3.870905614848819px 0 1px rgba(0,30,255,0.5), -3.870905614848819px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  }
  45% {
    text-shadow: 2.231056963361899px 0 1px rgba(0,30,255,0.5), -2.231056963361899px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  }
  50% {
    text-shadow: 0.08084290417898504px 0 1px rgba(0,30,255,0.5), -0.08084290417898504px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  }
  55% {
    text-shadow: 2.3758461067427543px 0 1px rgba(0,30,255,0.5), -2.3758461067427543px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  }
  60% {
    text-shadow: 2.202193051050636px 0 1px rgba(0,30,255,0.5), -2.202193051050636px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  }
  65% {
    text-shadow: 2.8638780614874975px 0 1px rgba(0,30,255,0.5), -2.8638780614874975px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  }
  70% {
    text-shadow: 0.48874025155497314px 0 1px rgba(0,30,255,0.5), -0.48874025155497314px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  }
  75% {
    text-shadow: 1.8948491305757957px 0 1px rgba(0,30,255,0.5), -1.8948491305757957px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  }
  80% {
    text-shadow: 0.0833037308038857px 0 1px rgba(0,30,255,0.5), -0.0833037308038857px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  }
  85% {
    text-shadow: 0.09769827255241735px 0 1px rgba(0,30,255,0.5), -0.09769827255241735px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  }
  90% {
    text-shadow: 3.443339761481782px 0 1px rgba(0,30,255,0.5), -3.443339761481782px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  }
  95% {
    text-shadow: 2.1841838852799786px 0 1px rgba(0,30,255,0.5), -2.1841838852799786px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  }
  100% {
    text-shadow: 2.6208764473832513px 0 1px rgba(0,30,255,0.5), -2.6208764473832513px 0 1px rgba(255,0,80,0.3), 0 0 3px;
  }
}
body::after {
  content: " ";
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background: rgba(18, 16, 16, 0.1);
  opacity: 0;
  z-index: 2;
  pointer-events: none;
  animation: flicker 0.15s infinite;
}
body::before {
  content: " ";
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%), linear-gradient(90deg, rgba(255, 0, 0, 0.06), rgba(0, 255, 0, 0.02), rgba(0, 0, 255, 0.06));
  z-index: 2;
  background-size: 100% 2px, 3px 100%;
  pointer-events: none;
}
* {cursor: url(https://pixels.crd.co/assets/images/gallery75/66164e41.gif?v=93aac41c), auto !important;}
</style>
  <div class="snowflake">
    <img src="https://pixels.crd.co/assets/images/gallery143/0f0a5b0c.gif?v=93aac41c" alt="Snowflake 1"/>
  </div>
  <div class="snowflake">
    <img src="https://pixels.crd.co/assets/images/gallery143/0f0a5b0c.gif?v=93aac41c" alt="Snowflake 2"/>
  </div>
<div class="snowflake">
    <img src="https://pixels.crd.co/assets/images/gallery137/714c3815.gif?v=93aac41c" alt="Snowflake 3"/>
  </div>
<div class="snowflake">
    <img src="https://pixels.crd.co/assets/images/gallery137/714c3815.gif?v=93aac41c" alt="Snowflake 4"/>
  </div>
  <div class="snowflake">
    <img src="https://pixels.crd.co/assets/images/gallery124/f88a5d0b.gif?v=93aac41c" alt="Snowflake 5"/>
  </div>
<div class="snowflake">
    <img src="https://pixels.crd.co/assets/images/gallery124/f88a5d0b.gif?v=93aac41c" alt="Snowflake 6"/>
  </div>

<style>
/* customizable snowflake styling */
.snowflake {
  color: #fff;
  font-size: 3em;
  font-family: Arial, sans-serif;
  text-shadow: 0 0 5px rgba(0,0,0,0.7);
}
@-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>

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

SunnieBunnie	1730244712 using! Report Comment
_freaxx_	1723478433 looks very nice :D Report Comment
DaejahBlu	1721199981 using! :D Report Comment
RATTICUS 🌈🦋	1718701294 using Report Comment
dani	1717191485 using! Report Comment
Dustywoods	1715628409 Usingg Report Comment
digitalprincxxs🦴🎀ྀིྀི	1713575687 using! Report Comment
! SUBSPACE T. MINE !	1712892673 I'm using it! -Subspace Report Comment
! SUBSPACE T. MINE !	1712892670 I'm using it! -Subspace Report Comment
Jeremías	1712543931 ¡Muy buen trabajo! Report Comment
fishy13	1712502065 cute !!! Report Comment
couchiiee	1712076990 using!!! Report Comment
nyx ↻	1711589085 using^^ Report Comment <33 by juana; 1711815980; Report
˚₊‧꒰ა Valentine ໒꒱ ‧₊˚	1710993091 usinggg ♡♡ Report Comment <3 by juana; 1711045377; Report
ZII3	1710958428 i love this sm omg Report Comment and i love uuu tysmm<333 by juana; 1710959805; Report
arlo	1710794993 damnn this is underrated, you deserve a grammy Report Comment omg, tysmm ️ by juana; 1710810290; Report
shiver me timbers	1710655246 using Report Comment I LOVE U by juana; 1710677745; Report