DARK LAYOUT VOL 1 .1

Tags: layout, cute, simple, emo, dark, black, 2000s

Description:

Preview:

click on the image for a larger preview

Code:

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

<style>

@import url('https://fonts.googleapis.com/css2?family=VT323&display=swap');
p{ font-family:'Playfair Display', serif; 
font-size: 100%;
color: white; 
}

h1, h2, h3, h4, h5{
font-family:'Playfair Display', serif; 
font-size: 100%;
color: white;
}


body {
background: url(https://images2.imgbox.com/ed/44/yAk6UuYY_o.jpeg);
}

main {
background:transparent;
border: none;
}

:root {
--logo-blue: transparent;
--darker-blue: white;
--lighter-blue: transparent;
--even-lighter-blue: transparent ;
--lightest-blue:  transparent;
--dark-orange: white;
--light-orange:transparent;
--even-lighter-orange:;
--green: blue;
}

.profile .friends .person p {
color: white;  
}


.profile .friends .person p:hover {
color: grey;  
}

a:hover {
     color: lightgrey; 

}
    .count {
        color: white;
    }




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

nav .links a:hover {
color: lightgrey;
}

footer {
color: white;
box-shadow: transparent;
text-decoration:;
text-decoration-style:;
background-color: transparent ;
border: 0px solid white;
}

.profile .blurbs .heading,
.profile .friends .heading{
color: #FFFFFF;
background-image: transparent;border-radius: 25px;
text-align: center;
padding: .1em;
}


body { cursor: url(https://cur.cursors-4u.net/cursors/cur-7/cur613.cur), auto; 
}


p{ font-family:'Playfair Display', serif; 
font-size: 100%;
color: ; 
}


.profile h1 {
font-family:'Playfair Display', serif; 
    font-size: 2em;
    color: white;
}

p {
font-family:'Playfair Display', serif; 
color:;
   } 

a {
font-family:'Playfair Display', serif; 
font-size: 14px;
     color: white; 
   }


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

.profile .contact .heading,
.profile .table-section .heading{
color: #FFFFFF;
background-image: transparent;border-radius: 25px;
text-align: center;
padding: .1em;
}

nav .links{
background-image: transparent;border-radius: 25px;
display: flex;
flex-wrap: wrap;
justify-content: space-around;
font-style: italic;
}



.friends {
    overflow: scroll;
    overflow-x: scroll;
    overflow-x: hidden;
    height: 300px; 
}

.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 {
content:;
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
content:;
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
content:;
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
content:;
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
content:;
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
content:;
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
content:;
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
content:;
}   

.online {
    content: url("https://ct.pimp-my-profile.com/online/26.gif");
}

html:before {
  animation: grain 8s steps(10) infinite;
  background-image: url(https://i.imgur.com/QpnTsrV.jpg);
  content: "";
  height: 300%;
  left: -50%;
  opacity:.3;
  position: fixed;
  top: -110%;
  width: 300%;
  pointer-events:none;
}
@keyframes grain {
  0%, 100% { transform:translate(0, 0) }
  10% { transform:translate(-5%, -10%) }
  20% { transform:translate(-15%, 5%) }
  30% { transform:translate(7%, -25%) }
  40% { transform:translate(-5%, 25%) }
  50% { transform:translate(-15%, 10%) }
  60% { transform:translate(15%, 0%) }
  70% { transform:translate(0%, 15%) }
  80% { transform:translate(3%, 35%) }
  90% { transform:translate(-10%, 10%) }
}

body::before {
content: " ";
display: block;
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: linear-gradient(rgb(82 15 15 / 48%) 50%, rgb(0 0 0 / 0%) 50%);
z-index: 2;
background-size: 100% 2px, 3px 100%;
pointer-events: none;
}




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

Ainsley	1736107784 usingg Report Comment
✮⭑ Star⭑ Dancer⭑ ✮	1732106986 Using Report Comment
kuzu	1730674841 usin Report Comment
danniiiiiiiiiiiiiiiiiiiiiiiiiii	1725153821 using Report Comment
bixbuny	1724192229 using Report Comment
Morris :P	1723177763 USING!!!!>>!!??!!!!!!! Report Comment
MEAF // RORY !!! (AUTOPLAY!!!!	1719487927 using!!! :3 Report Comment
McLovin	1706919156 using :p Report Comment
Ezraa	1703484084 Using!! Report Comment
gabriel	1701809716 using !! Report Comment
frank stein!!!	1699959454 Using!! :33 Report Comment
☆⋆｡YaZxx°‧★	1699743721 might use!!1 Report Comment
KOR3	1699742738 using!!! Report Comment
Nepeta Lejion	1699677470 Using:3 Report Comment
Luna Lovegood	1699487562 Using!! Report Comment
R1C0	1699219157 Using!! Report Comment
xavier.	1698791727 using Report Comment
tara	1698533558 using! Report Comment
malmo .ᐟ	1698367394 using! Report Comment
AimForresty	1698279285 damn this is a cool theme Report Comment