blue and black goth layout!!! slowdive background

Tags: slowdive, layout, blue, black, goth, emo, cyber, robotic, dark

Description:

hey!! this is my first layout and i dont think ill be using it anymore but its pretty cute so feel free to use , + optional stamps !! IMPORTANT !! there is 3 sections in this code so PLEASE insert them in 3 different sections for it to work properly, thanks!

Preview:

click on the image for a larger preview

Code:

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

who im looking for: (erase this row after copying) 







<br/>
<br/>
<img src="https://qph.cf2.quoracdn.net/main-qimg-206ca65132eacb20e6987583665794c4" style="width: 600px; height: 100px;"/>









<style>
body:before {
content: " ";
height: 100vh;
width: 100vw;
display: block;
position: fixed; 
top: 0; 
left: 0; 
z-index: 100;
background-image: url('https://ae01.alicdn.com/kf/H847eb492cd2e4de1a2624a439ae6917eI/Creative-Personality-Warning-Car-Stickers-Horn-To-Remind-Loud-Music-PVC-Waterproof-Sunscreen-Decal-Black-silver.jpg');
background-size: cover;
background-repeat: no-repeat;
background-position:center;
animation: yourAnimation 5s ease 0s 1 normal forwards;
pointer-events: none;}
@keyframes yourAnimation { 0.0%{ opacity: 1;} 75%{ opacity: 1; } 100%{ opacity: 0;} } 
</style>






About me:





<style>
nav img.logo {
 
 content:url("https://i.ibb.co/T2MC0Pp/rumialogo2.png");
    }
</style> 


<style>

@import url('https://fonts.googleapis.com/css2?family=Play&display=swap');
body{font-family: 'Play', sans-serif;}
{background-color: black;}
img {
filter: sepia(100%) hue-rotate(179deg) saturate(1.99);
}
body::bee {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 2;
  background: linear-gradient(rgba(20, 20, 100, 0.2) 50%, rgba(0, 0, 0, 0) 50%);
  background-size: 100% 2px, 3px 100%;
  pointer-events: none;
}
#q, button {
color: #C4F6FF;
background-color: black;
border: 1px solid grey;
font-family: inherit;
}
p, i, b, .count {
color: #C4F6FF !important;
}
a, .profile .friends .person p, .logout-btn {
color: #C4F6FF !important;
text-decoration: underline !important;
}
.container {
margin: 0 auto 0;
}
.icon {
display: none;
}
nav, nav .links a {
color: #C4F6FF;
}
nav .top {
margin-top: 2px;
background: none;
background-color: black;
border: 2px solid grey;
border-bottom: none;
}
nav .links {
background-color: black;
border: 2px solid grey;
}
body{
background-image:
url(https://upload.wikimedia.org/wikipedia/commons/thumb/c/cd/Black_from_a_camera.jpg/1200px-Black_from_a_camera.jpg);
background-attachment: fixed;
background-size: 1000px;
}

main {
background: black;
color: #C4F6FF;
border-left: 2px solid grey;
border-right: 2px solid grey;
}
.heading, .url-info {
color: #C4F6FF !important;
background: none;
background-color: black !important;
border: 2px solid grey !important;
}
.inner {
color: #C4F6FF !important;
border: 2px solid grey;
border-top: none;
}
.profile-info {
border: 2px solid grey;
}
.profile-info .inner {
border: none;
}
.friends .inner {
border-bottom: none;
}
#comments {
border-bottom: 2px solid grey;
}
.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: #C4F6FF !important;
}
.details-table {
margin: 2px;
}
.details-table, td {
border: 1px solid grey;
border-collapse: collapse;
}
td {
color: #C4F6FF !important;
background: none;
background-color: black !important;
} 
table.details-table {
max-width: 98%;
}
.profile h1 {
font-size: 20px;
}
footer {
background: black;
border: 2px solid grey;
}
footer p {
color #C4F6FF !important;
}
.comments-table {
border: none;
border-collapse: collapse;
}
.comment-replies {
border: 1px solid grey;
margin: 2px;
}
nav .info {
background: none;
}

</style>
<style>* {cursor: url(https://cur.cursors-4u.net/others/oth-1/oth3.ani), url(https://cur.cursors-4u.net/others/oth-1/oth3.png), auto !important;}</style><a href="https://www.cursors-4u.com/cursor/2005/05/17/oth3-11.html" target="_blank" title="Cigarette"><img src="https://cur.cursors-4u.net/cursor.png" alt="Cigarette" style="position:absolute; top: 0px; right: 0px;"/></a>


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

<style>
/* 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 */
max-width: 16px;
max-height: 16px;
content: url(https://media.discordapp.net/attachments/986482427981623297/1199784351127318659/image.png?ex=65c3cd40&is=65b15840&hm=59b947799ee4f34002de1d9abc6abda1c2c4679f23e434afcfbd63db8895f2d6&=&format=webp&quality=lossless&width=22&height=20);
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
/* add to favorite */
content: url(https://media.discordapp.net/attachments/986482427981623297/1199785306094837770/image.png?ex=65c3ce23&is=65b15923&hm=7e3d922e57becd67d9b7685caa5b148e667c176265644eaf08127a5a05659d8a&=&format=webp&quality=lossless&width=22&height=20);
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
/* send a message */
content: url(https://media.discordapp.net/attachments/986482427981623297/1199785553919496372/image.png?ex=65c3ce5e&is=65b1595e&hm=25e6f97be3246277ee6b692046ecdfcd05ec01cd73f73d2f8c138bf8c8babeb5&=&format=webp&quality=lossless&width=22&height=20);
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
/* foward to friend*/
content: url(https://media.discordapp.net/attachments/986482427981623297/1199783900302544956/image.png?ex=65c3ccd4&is=65b157d4&hm=bc5f643d4b78ddaa5c452c9da1182e94c2b8a3cf6a27c5258d3dc655b4986587&=&format=webp&quality=lossless&width=22&height=20);
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
/* instant message */
content: url(https://media.discordapp.net/attachments/986482427981623297/1199785954009952297/image.png?ex=65c3cebe&is=65b159be&hm=5986be1ae07e43e17ec3b62f9c0b6135474f4065cbbf8b83ac417259092cf59b&=&format=webp&quality=lossless&width=22&height=20);
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
/* block user */
content: url(https://media.discordapp.net/attachments/986482427981623297/1199786492525023242/image.png?ex=65c3cf3e&is=65b15a3e&hm=152b448ea43ce462934a55d6d5db2d1fe1e1123c680b52f64fc22ae14f94f529&=&format=webp&quality=lossless&width=22&height=20);
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
/* add 2 group  */
content: url(https://media.discordapp.net/attachments/986482427981623297/1199786679335125082/image.png?ex=65c3cf6b&is=65b15a6b&hm=1fa69d7362d3f8cfe3a0c985d95ae20d20011d11f3bf49b15ee06d1b95250069&=&format=webp&quality=lossless&width=22&height=20);
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
/* report */
content: url(https://media.discordapp.net/attachments/986482427981623297/1199787083372445766/image.png?ex=65c3cfcb&is=65b15acb&hm=1c3b07dd5cd07019c28aa60f502841dbac57410b1ba75b69de1141578edffdd1&=&format=webp&quality=lossless&width=22&height=20);
}   
</style>


<!-- (c) Layout created by 𝔯𝔢𝔯𝔦𝔢 ☆ (https://layouts.spacehey.com/layout?id=33426) -->

<style>

h1{
  animation: type 3s steps(27);
  color: white;
  font-size: 10px;
  font-family: courier;
  white-space: nowrap;
  overflow: hidden;
  }

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

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

{
content: " ";
display: block;
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: linear-gradient(rgb(10 10 50 / 20%) 50%, rgb(0 0 0 / 0%) 50%);
z-index: 2;
background-size: 100% 2px, 3px 100%;
pointer-events: none;
}
.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);
}

</style>









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

<style>
img:hover {
  /* Start the shake animation and make the animation last for 0.5 seconds */
  animation: shake 0.5s;

  /* When the animation is finished, start again */
  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); }
} </style>

<style>
button:hover {
  /* Start the shake animation and make the animation last for 0.5 seconds */
  animation: shake 0.5s;

  /* When the animation is finished, start again */
  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); }
} </style>


<iframe width="0" height="0" src="" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" loading="lazy" class="hideobj">
</iframe>

<style>
main:before {
 width: 100%;
 height: 200px;
 display: block;
 content: "";
 background-image: url(https://i.pinimg.com/originals/d1/ce/15/d1ce15d284b3e347422df62818e09af6.gif);
background-position: center; 
background-size: 100%;
}

</style>

      





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

<iframe width="0" height="0" src="https://www.youtube.com/embed/Ogn-mqe-nsU?autoplay=1&loop=1&playlist=Ogn-mqe-nsU" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" loading="lazy" data-ruffle-polyfilled="">

</iframe>








made by tarasука &lt;3

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

ThiriumBlues	1731937591 Using :3 Report Comment
yuo	1731848367 using Report Comment
Sbsilvver!	1731777425 using >0< Report Comment
Xyl	1731493209 The buttons under contacting layouts kinda just don't work Report Comment
KittyKang	1731475135 using!! ty Report Comment
cloudd	1731377826 using !! Report Comment
sophiez	1731352597 Using :p Report Comment
Ali🪦🕯	1731251902 Using Report Comment
Ali🪦🕯	1731251898 Using Report Comment
rory	1731210369 using ^^ Report Comment
☆°•.~ River Aureum ~.･｡ﾟ	1730825055 Using! Report Comment
⋅𖦹₊✧Emiot✧₊𖦹⋅	1730755740 Using! Report Comment
Snoot	1730650772 USING!! Report Comment
escapism	1730586122 using! ️ Report Comment
escapism	1730586121 using! ️ Report Comment
Max	1730556138 Using!! :) Report Comment
matuzzzz	1730391861 usinggg :333 Report Comment
Bi ᝰ.ᐟ	1730248723 USING!! Report Comment
@ ₖₒₛₛᵤₙ	1729959952 using!! Report Comment
miorie!	1729890184 Using!! Report Comment