simple grey/black emo layout

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

Description:

one of my old layouts, if u dont want a panda cursor its the last bit of code at the bottom. (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=83079) -->

<style>

body {
   background: #fff url(https://wallpapercave.com/wp/lEh3x7Z.jpg);
   color: #fff;

}


main {
   background: #f2f0f000;
   color: #fff;
}

div.top {
    background:linear-gradient(rgba(24, 24, 24, 0.8) 0%, rgb(255, 255, 255, 0.2) 100%);
   border-top: 4px solid #919191;
   border-left: 4px solid  #919191;
   border-right: 4px solid #919191;
   padding: 10px;
   margin-top: 10px;
}

.links {
   background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(94,94,94,1) 50%, rgba(117,117,117,1) 50%, rgba(196,196,196,1) 100%);;
   border-bottom: 2px solid #919191;
   border-left: 3px solid #919191;
   border-right: 3px solid #919191;
   padding: 2px;
   font-size: 12px;
   text-align: center;
}


.blurbs, .comments-table, .url-info, .table-section, .general-about, .blog-preview, .friends-grid, .mood {
   Font-size: 14px;
   Color: #fff;
    background:linear-gradient(rgba(24, 24, 24, 0.8) 0%, rgb(255, 255, 255, 0.2) 100%);
   border: 4px solid #919191;
   padding: 2px;
}

.profile-pic img {
   width: 200px;
   padding: 10px;
}

.details {
   color: #fff;
}

.mood {
   color: #fff;
   margin-top: 15px;
   margin-bottom: 15px;
}

.contact {
   background: #000;
}


.contact .inner a img {
   filter: sepia(100%) hue-rotate(190deg) saturate(500%);
}

.comments-table {
   color: #000;
   background:linear-gradient(rgba(24, 24, 24, 0.8) 0%, rgb(255, 255, 255, 0.2) 100%);

}

.general-about {
   overflow: auto;
}

.profile .url-info {
   border: 4px solid #919191;
}
.profile .contact {
   border: 4px solid  #919191;
}
.profile .table-section {
   border: 4px solid  #919191;
}
/* 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: "♫"
}
.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: "♫"
}

footer {
   color: #fff;
   background: #00000087;
   border: 4px solid #919191;
}

footer .links {
   background: rgba(0, 0, 0, 0);
   border: 0px;

}

.inner {
   color: #fff;
}

button {
   color: #fff;
   background: #000; 
   border: 2px solid  #919191;
}

button:hover {
   color: #fff;
   background: #b60006;
}

input {
   background: linear-gradient(0deg, rgba(255,255,255,1) 31%, rgba(198,198,198,1) 100%);
  }

.count {
   color: #b60006;
   background: #000;
}

a:hover {
   color: #b60006;
}
nav .links a:hover {
  text-decoration: none;
  Color: #b60006;
}

::selection {
   background: #fff;
   color: #000
}

.online {
   content: url(https://dl.glitter-graphics.com/pub/2977/2977298zohekyrym6.gif);
   
}

h1 {
   text-align: center;
   color:#fff;
}

.logo {
   content: url(https://i.imgur.com/yeRU4Gt.png) width= "100px";
}

:root {
  --light-gray: #f2f0f0;
  --gray: #e3e3e3;
  --dark-gray: #919191;
  --darker-gray: #545454;
  --logo-blue: #000;
  --darker-blue: #fff;
  --lighter-blue: #000;
  --even-lighter-blue: #000;
  --lightest-blue: #00000087;
  --red: #fff;
  --dark-orange: #fff;
  --light-orange: #000;
  --even-lighter-orange: #fff;
  --strange-yellow: #00abff;
  --green: #34D399;
  --light-green: #E6F8DD;
  --medium-green: #A0C99C;
  --dark-green: #059669;
}

</style>


<style>* {cursor: url(https://cur.cursors-4u.net/nature/nat-9/nat865.cur), auto !important;}</style><a href="https://www.cursors-4u.com/cursor/2010/11/06/cute-panda.html" target="_blank" title="Cute Panda"><img src="https://cur.cursors-4u.net/cursor.png" alt="Cute Panda" 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 86 comments ( View all | Add Comment )

Spookie Slaughter	1751938235 using :3 Report Comment
saяx	1751937167 using Report Comment
Karo	1745340704 usingg Report Comment
marc	1745225823 using the background photo ty :) Report Comment
Sixz:P	1745215573 using:) Report Comment
tianne	1744922839 using :) Report Comment
Mugen	1744605156 using! Report Comment
◟ 𝓇𝑜𝓊𝑔𝑒 . ᛝ	1744523505 using!! Report Comment
Ash 丰	1743973569 Using Report Comment
Beny	1743879079 using Report Comment
i.4m.cris	1742676697 using Report Comment
˚₊‧꒰ა Holly ໒꒱ ‧₊˚	1741392402 usinggg! Report Comment
☣blattodeaBot☣	1741039964 using n editing a bit :p Report Comment
moret 🤍	1739543917 using Report Comment
sxtvrn	1737827511 using! Report Comment
SpaceJunkie42	1737666286 Using! Report Comment
ripY0uth	1737278243 Usinggg Report Comment
✯3rotic.snack✯	1737120239 usingg Report Comment
rawrjuul	1736791075 Using Report Comment