The Vibrant Dark 2000

Tags: dark, vibrant, 2000s, cool, chill, fun, night, colorful

Description:

A cool vibrant colored theme I made. It looks good in the eyes and is a bit colorful with the greens, blues, reds, etc! Please make sure to credit me and comment here or on my profile if you use it!

Preview:

click on the image for a larger preview

Code:

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

<style>
@import url('https://files.catbox.moe/c5mkoh.ttf');

@font-face {
  font-family: 'dejavu';
  src: url('https://files.catbox.moe/c5mkoh.ttf');
}

.profile .blog-preview p {
margin-bottom: 14px;
padding: 7px;
}

.profile .blog-preview {
border-left: 2px solid #08144d;
border-right: 2px solid #08144d;
border-bottom: 2px solid #08144d;
}

.logout-btn {
text-indent: -9999px;
line-height: 0;
}

.logout-btn:after {
content: 'Log Out';
text-indent: 0;
  display: block;
  line-height: initial;
}

button:hover {
cursor: pointer;
}

.profile .online img {
display: none;
}
.profile .friends .person img:not(.icon) {
min-width: 95px;
  min-height: 95px;
  display: block;
  margin: 0 auto;
  box-shadow: 4.5px 4.5px 3.6px rgba(0, 0, 0, 0.098), 12.5px 12.5px 10px rgba(0, 0, 0, 0.14), 30.1px 30.1px 24.1px rgba(0, 0, 0, 0.182), 100px 100px 80px rgba(0, 0, 0, 0.28);
  border: 5px solid white;
border-radius: 100%;
}

.details-table td:first-child {
background: #0d2283;
  color: white;
  font-weight: bold;
  width: 33%;
  text-align: center;
vertical-align: center;
}

.details-table td {
border: 2px solid #08144d;
background-color: #193fcc;
vertical-align: center;
}

.comments-table {
border: 0;
}

.comments-table td:first-child {
background: #0d2283;
  color: white;
}

.comments-table td:first-child img {
border-radius: 100%;
 box-shadow: 4.5px 4.5px 3.6px rgba(0, 0, 0, 0.098), 12.5px 12.5px 10px rgba(0, 0, 0, 0.14), 30.1px 30.1px 24.1px rgba(0, 0, 0, 0.182), 100px 100px 80px rgba(0, 0, 0, 0.28);
  border: 5px solid white;
}

.comments-table td {
border: 2px solid #08144d;
background-color: #193fcc;
padding: 10px;
}

.profile .friends .person p {
  color: #cecece;
  font-weight: bold;
  width: 100%;
  overflow-wrap: break-word;
  word-break: break-word;
  font-size: 100%;
  text-align: center;
}

.profile .table-section {
border: 2px solid #08144d;
}

.profile .url-info {
  border: 2px solid #08144d;
}

.profile .blurbs, .profile .friends {
border: 2px solid #08144d;
}

.profile .blurbs .inner h4, .profile .count {
color: lime;
}

.profile .comments {
border-top: 0;
border-left: 2px solid #08144d;
border-right: 2px solid #08144d;
border-bottom: 2px solid #08144d;
}

.profile .table-section .heading, .profile .blurbs .heading, .profile .friends .heading, .profile .comments .heading {
color: white;
background: rgb(12,33,128);
background: -moz-linear-gradient(0deg, rgba(12,33,128,1) 0%, rgba(26,65,210,1) 100%);
background: -webkit-linear-gradient(0deg, rgba(12,33,128,1) 0%, rgba(26,65,210,1) 100%);
background: linear-gradient(0deg, rgba(12,33,128,1) 0%, rgba(26,65,210,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0c2180",endColorstr="#1a41d2",GradientType=1); 
border-bottom: 2px solid #08144d;
}

.profile .blog-preview h4 {
border-top: 2px solid #08144d;
}

.profile .contact .heading, .profile .blog-preview h4 {
padding: 2px 7px;
color: white;
background: rgb(12,33,128);
background: -moz-linear-gradient(0deg, rgba(12,33,128,1) 0%, rgba(26,65,210,1) 100%);
background: -webkit-linear-gradient(0deg, rgba(12,33,128,1) 0%, rgba(26,65,210,1) 100%);
background: linear-gradient(0deg, rgba(12,33,128,1) 0%, rgba(26,65,210,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0c2180",endColorstr="#1a41d2",GradientType=1); 
border-bottom: 2px solid #08144d;
}

.profile .contact {
  border: 2px solid #08144d;
}

main .profile-pic img {
border-radius: 100%;
box-shadow:
  4.5px 4.5px 3.6px rgba(0, 0, 0, 0.098),
  12.5px 12.5px 10px rgba(0, 0, 0, 0.14),
  30.1px 30.1px 24.1px rgba(0, 0, 0, 0.182),
  100px 100px 80px rgba(0, 0, 0, 0.28)
;
border: 7px solid white;
}

main .online {
color: lime;
}

main {
background: rgb(0, 0, 0);
    background: -moz-linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(110, 110, 110, 1) 100%);
    background: -webkit-linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(110, 110, 110, 1) 100%);
    background: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(110, 110, 110, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000", endColorstr="#6e6e6e", GradientType=1);
    padding: 10px;
    overflow-x: hidden;
    overflow-y: scroll;
word-wrap: normal;
    border: 2px solid black;
    color: white;
}

nav .links li:not(:last-child)::after, footer .links li:not(:last-child)::after {
  content: " . ";
  color: transparent;
}

footer .links li:not(:last-child)::after, footer .links li:not(:last-child)::after {
  content: " . ";
  color: transparent;
}

nav input[type='text'] {
padding: 5px;
border-radius: 5px 0 0 5px;
border: 1px solid black;
}

main a {
color: yellow;
text-decoration: none;
}

main a:hover {
color: yellow;
text-decoration: underline;
}

button {
border-radius: 5px;
border: 1px solid #a4a4a4;
 background: rgb(150,150,150);
background: -moz-linear-gradient(0deg, rgba(150,150,150,1) 0%, rgba(255,255,255,1) 100%);
background: -webkit-linear-gradient(0deg, rgba(150,150,150,1) 0%, rgba(255,255,255,1) 100%);
background: linear-gradient(0deg, rgba(150,150,150,1) 0%, rgba(255,255,255,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#969696",endColorstr="#ffffff",GradientType=1); 
    padding: 5px;
    text-align: center;
    color: black;
    font-weight: bolder;
    font-size: x-small;
    width: fit-content;
}

nav button {
border-radius: 0 5px 5px 0;
border: 2px solid #a4a4a4;
 background: rgb(150,150,150);
background: -moz-linear-gradient(0deg, rgba(150,150,150,1) 0%, rgba(255,255,255,1) 100%);
background: -webkit-linear-gradient(0deg, rgba(150,150,150,1) 0%, rgba(255,255,255,1) 100%);
background: linear-gradient(0deg, rgba(150,150,150,1) 0%, rgba(255,255,255,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#969696",endColorstr="#ffffff",GradientType=1); 
    padding: 5px;
    text-align: center;
    color: black;
    font-weight: bolder;
    font-size: x-small;
    width: fit-content;
}

body {
padding: 10px;
    background-color: #141414;
    color: white;
    font-family: 'dejavu';
} 

nav .links {
    text-transform: uppercase;
    padding: 10px;
    border: 2px solid #38000a;
    color: white;
    text-align: center;
    background: rgb(50, 3, 20);
    background: -moz-linear-gradient(0deg, rgba(50, 3, 20, 1) 0%, rgba(142, 3, 34, 1) 100%);
    background: -webkit-linear-gradient(0deg, rgba(50, 3, 20, 1) 0%, rgba(142, 3, 34, 1) 100%);
    background: linear-gradient(0deg, rgba(50, 3, 20, 1) 0%, rgba(142, 3, 34, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#320314", endColorstr="#8e0322", GradientType=1);
    text-align: center;
    text-shadow: 0; !important
    font-size: 13px;
}

footer .links {
    text-transform: uppercase;
    padding: 10px;
    text-align: center;
    text-shadow: 0; !important
    font-size: 13px;
}

footer a {
color: white;
}

nav .top, footer {
padding: 10px;
    border-radius: 5px 5px 0 0;
    border: 2px solid #00290c;
    color: white;
    background: rgb(13, 60, 21);
    background: -moz-linear-gradient(0deg, rgba(13, 60, 21, 1) 0%, rgba(6, 112, 31, 1) 100%);
    background: -webkit-linear-gradient(0deg, rgba(13, 60, 21, 1) 0%, rgba(6, 112, 31, 1) 100%);
    background: linear-gradient(0deg, rgba(13, 60, 21, 1) 0%, rgba(6, 112, 31, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0d3c15", endColorstr="#06701f", GradientType=1);
}

a:hover{
text-decoration: underline;
    color: white;
}

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

footer {
font-size: 14px;
border-radius: 0 0 5px 5px;
}
</style>
I am an avgeek and like old tech. This is it for now.

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

brazillian1	1755733188 looks awesome, is there a way to change the thickness of the profile pic borders tho? it's a lil too thick for me Report Comment
shtty_brony	1753280490 using Report Comment Thank you! by cbladeOfficial; 1753810052; Report
SunnieBunnie	1750186873 using Report Comment Thank you! by cbladeOfficial; 1752516316; Report
ozolog1	1749194502 using Report Comment Thank you! by cbladeOfficial; 1752516321; Report
AHHHHHH_opal 0c0	1748814950 using :P Report Comment Thank you! by cbladeOfficial; 1752516334; Report
Kitsune	1748224409 - Using... Report Comment Thank you! by cbladeOfficial; 1752516300; Report
JJ	1745266897 using!! :) Report Comment Thank you! by cbladeOfficial; 1746446404; Report
niki	1744822810 using! Report Comment Thank you! by cbladeOfficial; 1745066317; Report
Zacharyy	1744516267 using Report Comment Thank you! by cbladeOfficial; 1744525041; Report
mahooul	1740858640 using Report Comment Thank you! by cbladeOfficial; 1741093638; Report
sena	1740429415 using!! Report Comment Thank you! by cbladeOfficial; 1740659814; Report
:D	1740345552 using Report Comment Thank you! by cbladeOfficial; 1740659801; Report
C1EL_PHANTOM8	1740255218 using Report Comment Thank you! by cbladeOfficial; 1740659786; Report
chrome08	1740132066 very cool, using Report Comment Thank you! by cbladeOfficial; 1740659765; Report
carson!	1738708075 using! Report Comment Thank you! by cbladeOfficial; 1738777089; Report
Osdsk	1737756860 using Report Comment Thank you! by cbladeOfficial; 1737788238; Report
chloe $	1737251119 usingg Report Comment Thank you! by cbladeOfficial; 1737280494; Report
TrashyAlienz	1736223792 usingg Report Comment Thank you! by cbladeOfficial; 1736426901; Report
parks	1736048565 usin Report Comment Thank you! by cbladeOfficial; 1736170428; Report
Kelton Smith	1735528544 using!!! thank you Report Comment Thanks for using! by cbladeOfficial; 1735624050; Report