squid sisters/splatoon layout

Tags: splatoon, squid sisters, layout
Description:

credit to most of everything i used is in the code,, comment if using
Preview:

click on the image for a larger preview
Code:

<!-- (c) Layout created by [S] gumball (https://layouts.spacehey.com/layout?id=104337) -->

<!-- (c) Layout created by звезды (#1 vflower fan) (https://layouts.spacehey.com/layout?id=101733) -->

<style>

.online{content:url("https://images.cooltext.com/5692795.gif");}

</style>

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

<style>
nav .top .left .logo {
    width: 165px;
    height: 42px;
    content: url(https://i.ibb.co/6r67R1y/IMG-8112-removebg-preview.png);
</style>

<style>
nav .top .left .logo {
    width: 165px;
    height: 42px;
    content: url(https://i.ibb.co/S5zgBpF/IMG-8106-removebg-preview.png);
</style>


<img src="https://media.tenor.com/GFsEnp3THqgAAAAi/splatoon-callie.gif"/>

<style>
@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;
}
</style>

<style>
.general-about .profile-pic img{
clip-path: polygon(50% 0%, 67% 29%, 98% 35%, 75% 58%, 79% 91%, 50% 75%, 21% 91%, 25% 58%, 2% 35%, 33% 29%);
</style>

<style>
.general-about .profile-pic img{
clip-path: polygon(50% 0%, 67% 29%, 98% 35%, 75% 58%, 79% 91%, 50% 75%, 21% 91%, 25% 58%, 2% 35%, 33% 29%);
}
.profile .friends .person img {
clip-path: polygon(50% 0%, 67% 29%, 98% 35%, 75% 58%, 79% 91%, 50% 75%, 21% 91%, 25% 58%, 2% 35%, 33% 29%);
}
.comments-table img,
.person img{
clip-path: polygon(50% 0%, 67% 29%, 98% 35%, 75% 58%, 79% 91%, 50% 75%, 21% 91%, 25% 58%, 2% 35%, 33% 29%);
}
</style>


<style>
@font-face {
font-family: meow;
src: url(https://external-media.spacehey.net/media/s7vzH60wcrgk-qcc2y-gLAtzs9hNkIozw78i5L4cVBFA=/https://dl.dropbox.com/s/50dhui1xv8uyuqu/QuietMeows.ttf);
}
 
#meow {
font-family: meow;
}

h1, .friends a p, h4{
  font-family: meow;
  text-align: center;
}

.container{
  width: 700px;
}
</style>

<!-- (c) Layout created by 電子戦 (https://layouts.spacehey.com/layout?id=99345) -->

<style>


:root {
    --background-color: #000000; /* chlordane background color */
    --text-color: #448844; /* chlordane text color */
    /*--border-color: #77dd88;  chlordane border color */
    --border-color: #3a553a;  /* chlordane border color */
    --secondary-color: #3a553a; /* chlordane secondary color */
    --accent-color: #448844; /* chlordane accent color */
    --highlight-color: #ee1111; /* chlordane highlight color */
    --inactive-color: #606060; /* chlordane inactive color */
    --selection-color: #223322; /* chlordane selection color */
}

body {
    background-color: #000000;
}


}


body::before {
    content: " ";
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 2;
    background-size: 100% 2px, 3px 100%;
    pointer-events: none;
}

#q, button {
    color: #77dd88; /* chlordane color */
    background-color: #000000; /* chlordane background color */
    border: 1px solid grey;
    font-family: inherit;
}

p, i, b, .count {
    color: #77dd88 !important; /* chlordane color */
}

a, .profile .friends .person p, .logout-btn {
    color: var(--border-color) !important; /* chlordane color */
    text-decoration: underline !important;
}

.container {
    margin: 0 auto 0;
}

.icon {
    display: none;
}

.heading h4::before {
    content: "□ ";
}


nav, nav .links a {
    color: var(--border-color); /* chlordane color */
    text-decoration: none;
    text-shadow: none;
}

nav .links a::first-letter {
    text-decoration: underline;
}



nav .top {
    margin-top: 2px;
    background: none;
    background-color: #000000; /* chlordane background color */
    border: 2px solid var(--border-color);
    border-bottom: none;
}

nav .links {
    background-color: #000000; /* chlordane background color */
    border: 2px solid var(--border-color);
}

nav img.logo {
    filter: brightness(0) saturate(100%) invert(81%) sepia(66%) saturate(286%) hue-rotate(171deg) brightness(105%) contrast(104%); !important;
}

main {
    background: #000000; /* chlordane background color */
    color: #77dd88; /* chlordane color */
    border-right: 2px solid var(--border-color) !important;
    border-left: 2px solid var(--border-color) !important;
}

.heading, .url-info {
    color: #77dd88 !important; /* chlordane color */
    background: none;
    background-color: #000000 !important; /* chlordane background color */
    border: 2px solid var(--border-color) !important;
}

.inner {
    color: #77dd88 !important; /* chlordane color */
    border: 2px solid var(--border-color);
    border-top: none;
}

.profile-info {
    border: 2px solid var(--border-color);
}

.profile-info .inner {
    border: none;
}

.friends .inner {
    border-bottom: none;
}

#comments {
    border-bottom: 2px solid var(--border-color);
}

.profile .contact, .profile .table-section, .home-actions {
    border: none !important;
}

.profile .contact .f-row:first-of-type {
    margin-top: 0px;
    padding-top: 7px;
}

.profile .blurbs .section h4 {
    color: #77dd88 !important; /* chlordane color */
}

.details-table {
    margin: 2px;
}

.details-table, td {
    border: 1px solid var(--border-color);
    border-collapse: collapse;
}

td {
    color: #77dd88 !important; /* chlordane color */
    background: none;
    background-color: #000000 !important; /* chlordane background color */
}

table.details-table {
    max-width: 98%;
}

.profile h1 {
    font-size: 20px;
}

footer {
    background: #000000; /* chlordane background color */
    border: 2px solid var(--border-color);
}

footer p {
    color: #77dd88 !important; /* chlordane color */
}

.comments-table {
    border: none;
    border-collapse: collapse;
}

.comment-replies {
    border: 1px solid grey;
    margin: 2px;
}

nav .info {
    background: none;
}
</style>




<style>
.profile h1 {
    font-size: 38px;
    font-weight: 550;
   
    animation: myAnim 2s infinite;

z-index: 100;

}


}
</style>






<style>
.profile h1 {
    font-size: 38px;
    font-weight: 550;
   
    animation: myAnim 2s infinite;

z-index: 100;

}

@keyframes myAnim {
    0% {
        transform: scale3d(1, 1, 1);
        
    }

    14% {
        
    }

    30% {
        transform: scale3d(1.25, 0.75, 1);
        
    }

    40% {
        transform: scale3d(0.75, 1.25, 1);
        
    }

    50% {
        transform: scale3d(1.15, 0.85, 1);
        
    }

    57% {
        
    }

    65% {
        transform: scale3d(0.95, 1.05, 1);
        
    }

    75% {
        transform: scale3d(1.05, 0.95, 1);
    }

    85% {
        
    }

    100% {
        
    }
}
</style>



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

<style>
    .profile{direction: rtl;}
.blog-preview{direction: ltr; text-align: center;}
    .blurbs{direction: ltr;}
    .friends{direction: ltr;}
    .general-info{direction: ltr;}
.profile .left h1{direction: ltr;}
    .details-table{direction: ltr;}
    .profile .table-section .heading{direction: ltr;}
    .details p{direction: ltr;}
	.mood{direction: ltr; text-align: right;}
.contact .heading {display: none !important;}
.url-info{direction: ltr; text-align: right;}
</style>




<!-- (c) Layout created by R>A>M>O>N>A !! (Ruvale era) (https://layouts.spacehey.com/layout?id=99714) -->

<div class="snowflakes">
<div class="snowflake"><img src="https://64.media.tumblr.com/e7117e5990831b3d4927699a5e111481/6bcb9f9093dd02a9-6e/s75x75_c1/4db4f593d9cea87589cf843c600ef4eedda02af3.pnj"/></div>
<div class="snowflake"><img src="https://64.media.tumblr.com/cbafa8b6b2b60093ac0abf9d503e4790/6bcb9f9093dd02a9-54/s75x75_c1/73cd97b061a181835c8998378298a50b9b713bd2.pnj"/></div>
<div class="snowflake"><img src="https://64.media.tumblr.com/e7117e5990831b3d4927699a5e111481/6bcb9f9093dd02a9-6e/s75x75_c1/4db4f593d9cea87589cf843c600ef4eedda02af3.pnj"/></div>
<div class="snowflake"><img src="https://64.media.tumblr.com/cbafa8b6b2b60093ac0abf9d503e4790/6bcb9f9093dd02a9-54/s75x75_c1/73cd97b061a181835c8998378298a50b9b713bd2.pnj"/></div>
<div class="snowflake"><img src="https://64.media.tumblr.com/e7117e5990831b3d4927699a5e111481/6bcb9f9093dd02a9-6e/s75x75_c1/4db4f593d9cea87589cf843c600ef4eedda02af3.pnj"/></div>
<div class="snowflake"><img src="https://64.media.tumblr.com/cbafa8b6b2b60093ac0abf9d503e4790/6bcb9f9093dd02a9-54/s75x75_c1/73cd97b061a181835c8998378298a50b9b713bd2.pnj"/></div>
<div class="snowflake"><img src="https://64.media.tumblr.com/e7117e5990831b3d4927699a5e111481/6bcb9f9093dd02a9-6e/s75x75_c1/4db4f593d9cea87589cf843c600ef4eedda02af3.pnj"/></div>
<div class="snowflake"><img src="https://64.media.tumblr.com/cbafa8b6b2b60093ac0abf9d503e4790/6bcb9f9093dd02a9-54/s75x75_c1/73cd97b061a181835c8998378298a50b9b713bd2.pnj"/></div>
</div>

<style>
    @-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>




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

<style>

main:before {
	width: 100%;
	height: 180px;
	display: block;
	content: "";
	background-image: url('https://media1.tenor.com/m/jXF5RWUc94sAAAAC/squidsisters.gif');
	background-position: center center;
	background-size: cover;
}
@media only screen and (max-width: 500) {
	main:before{
		height: 100;
	}
}

</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 13 of 13 comments ( View all | Add Comment )
Kas	1741076180 using!!!! Report Comment
twoxfan	1739150963 Using ! Report Comment
Dan	1737227583 using! Report Comment
marie✬	1736905915 using! Report Comment
DeadSetGoat	1736526989 Will use as base! Report Comment
CJ (AutoPlay Music)	1733534194 Luv it ^^ Using Report Comment
r0sie	1731412806 SO EPIC !!!! Report Comment
caz 🦕𖦹⋆｡˚(evil )	1727899249 USING!! Report Comment
୨♡୧ callie !! 🎀 (the silliest of spacehey)	1722548674 GONNA USE THIS OMG SO COOL Report Comment
L☆mon	1722287396 USING! Report Comment
Otaku くコ:彡	1720623105 using ! <3 Report Comment
himbolovr	1719455637 Using! Report Comment
Bit!Pak	1718765065 I Will use!! Report Comment