Dark grey/blueish layout

Tags: dark, emo, black, grey, 2000s, edgy, goth

Description:

I spent super long on this lol, there's a bat cursor, if u don't want that it's at the end of the code. (credit me if u use this!)

Preview:

click on the image for a larger preview

Code:

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

<style>

.container{
        width: 920px;
margin-top:13px;
    }

 body {  filter: grayscale(75%);
  background: url(https://i.pinimg.com/564x/0e/7f/6d/0e7f6d1b2f7ae99950122a96484421ca.jpg);
  background-size: cover ;
background-attachment: fixed;
font-family: Simonetta }

div.top {
  background: #20315a;
  box-shadow: 5px -12px 19px 6px #000000;
}
 .links {
 background: linear-gradient(0deg, rgba(48,68,118, 1) 0%, rgba(30,47,82,1) 25%, rgba(23,36,64,1) 50%, rgba(48,68,118, .9) 100%);
   text-align: center;

}

.profile h1 {
    font-size: 32px;
    margin-left: 25px;
}

.general-about .profile-pic img {
    max-width: 215px;
    max-height: 190px;
   box-shadow: 2px 2px 19px 2px #000000;
    margin-left: 10px;
   
}

.profile .mood {
 margin-top: 25px;
}

.online { 
    content: url(https://dl.glitter-graphics.com/pub/2419/2419240fiqjh31ilb.gif);
    width: 31%;

}
main:before{
width: 100%

margin-bottom: 1px;
margin-top: -6px;
height: 150px;
display: block;
content: url();
filter: grayscale(65%);
box-shadow: 2px 2px 19px 2px #000000;
background-image: url(https://i.pinimg.com/236x/d3/db/9d/d3db9d41c0e0d336435f9a522097194f.jpg);
background-position: center center;
background-size: cover;
background-position:center;
background-color: transparent;
background-repeat: repeat;
}

.profile-info {
    background: 
    url(https://i.ibb.co/fpHLFg4/emo-banner.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: left
}

main {
  background: linear-gradient(rgba(248, 248, 248, .7) 0%, rgb(18, 31, 60, .7) 100%, rgba(18, 31, 60, .7) 0%);
box-shadow: 5px 5px 19px 6px #000000;
    font-size: 18px;
}

.profile .blurbs .heading,.profile .friends .heading {
    background: #20315a;
    text-shadow: 4px 3px 4px black;
box-shadow: 2px 2px 4px 2px black;
     font-size:15px;
}

.profile .contact .heading, .profile .table-section .heading {
background:  #20315a;
    text-shadow: 4px 3px 4px black;
box-shadow: 2px 2px 4px 2px black;
  font-size:15px;
}


.profile .contact, .profile .url-info, .profile .table-section, .setting-section {
border: transparent;
box-shadow: 2px 2px 4px 2px black;
}

.profile .blurbs .inner, .profile .friends .inner, .blog-entry .comments .inner, .bulletin .comments .inner, .setting-section .inner {
    box-shadow: 2px 2px 6px 2px black;

}

.profile .contact .heading h4, .profile .table-section .heading h4, .profile .blurbs .heading h4, .profile .friends .heading h4, .blog-entry .comments .heading h4, .bulletin .comments .heading h4, .home-actions .heading h1, .setting-section .heading h4, .statistics .heading h4 { color: lightgrey; 
    text-shadow: 4px 3px 4px black;
       font-size:15px;
}

.profile .blurbs .section h4 {
 color: transparent;
}

.details-table td:first-child {
    background: #20315a;
    color: lightgrey;
    font-weight: bold;
    text-shadow: 4px 3px 4px black;
   padding: 0px;
     font-size:15px;
}

.details-table td{
    background:  rgba(24, 36, 64, .5);
    color: #929292;
    text-shadow: 4px 3px 4px black;
      padding: 0px;
  font-size:15px;
}
   

.comments-table td:first-child {
 background: #20315a;
    color: lightgrey;
    font-weight: bold;
    text-shadow: 4px 3px 4px black;
    font-size:15px;
}

table.comments-table, {
    color: lightgrey;
    text-shadow: 4px 3px 4px black;
  font-size:15px;
}

.comments-table td {
    background:  rgba(24, 36, 64, .5);
    color: #929292;
    text-shadow: 4px 3px 4px black;
  font-size:15px;
}
.profile .friends .person p {
color: black;
}

.profile .friends .inner {
    height: 250px;
    overflow-y: scroll;
}


footer {
background:#20315a;
box-shadow: 5px 12px 19px 6px #000000;
}

/* 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: url(https://i.ibb.co/MRXz01G/1d8850b5.gif);
 filter: grayscale(.7);
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
/* add to favorite */
content: url(https://i.ibb.co/MRXz01G/1d8850b5.gif);
 filter: grayscale(.7);
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
/* send a message */
content: url(https://i.ibb.co/wRBQZDX/OEXw2bO.png);
 filter: grayscale(.7);
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
/* foward to friend*/
content: url(https://i.ibb.co/wRBQZDX/OEXw2bO.png);
 filter: grayscale(.7);
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
/* instant message */
content: url(https://i.ibb.co/MRXz01G/1d8850b5.gif);
 filter: grayscale(.7);
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
/* block user */
content: url(https://i.ibb.co/MRXz01G/1d8850b5.gif);
 filter: grayscale(.7);
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
/* add 2 group  */
content: url(https://i.ibb.co/wRBQZDX/OEXw2bO.png);
 filter: grayscale(.7);
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
/* report */
content: url(https://i.ibb.co/wRBQZDX/OEXw2bO.png);
 filter: grayscale(.7);
}


a{
  color: #fff;
  text-decoration: italic;
  text-shadow: 4px 3px 4px black;
}

button:hover {
   color: #fff;
   background:#121f3c;
}
a:hover {
   color: #121f3c;
   text-shadow:  4px 3px 4px black;
}
nav .links a:hover {
  text-decoration: none;
  Color:#121f3c;
  text-shadow:  4px 3px 4px black;
}
.count {
   color: #121f3c;
}






</style>

<style>* {cursor: url(https://cur.cursors-4u.net/holidays/hol-1/hol62.cur), auto !important;}</style><a href="https://www.cursors-4u.com/cursor/2005/10/31/hol62.html" target="_blank" title="Black Bat"><img src="https://cur.cursors-4u.net/cursor.png" alt="Black Bat" style="position:absolute; top: 0px; right: 0px;"/></a>

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

vxl~tine	1732155789 using Report Comment
Lari	1732066067 Using as base c: Report Comment
showbizy	1732064724 usingggg Report Comment
V	1731951902 using Report Comment
x.nxty.	1731515214 usingg Report Comment
Traumarchive	1731144607 USINGG Report Comment
-‘♔’-п¥RпИN@-‘♔’-	1730066175 using as a base ¬‿¬ Report Comment
vampinzi	1729430484 usingg Report Comment
Marcy Sir Larceny !	1728788001 Using Report Comment
Santi	1727505131 usingg!! it looks great thx! Report Comment
,,zombatzo ⛧	1725340710 uysingng ! Report Comment
Split	1723656642 using :) Report Comment
Yura `	1723582663 using Report Comment
「 Michael 」	1723008362 using! Report Comment
das 𓋹	1722654635 Using Report Comment
🦴zara dog⛧,,	1721836673 usinn Report Comment
spookrie	1721778995 using <3 Report Comment
Luciette	1721762417 Using Report Comment
nfejnXzz00	1719521146 Using! Report Comment