slipknot self-titled layout

Tags: slipknot, music, 90s, layout, metal, numetal, nu metal, red, black

Description:

autoplay set to wait and bleed

additional credits:

cd pfp: https://layouts.spacehey.com/layout?id=29048

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by trash (auto music) (https://layouts.spacehey.com/layout?id=103566) -->

<div class="chris">
<div class="clown">

<style>
@import url('https://fonts.cdnfonts.com/css/sickness');

div.chris {
    background: url(https://i.ibb.co/hCZbk01/chris.gif) no-repeat;
    background-size: 100%!important;
    position: fixed;
    left: 0px;
    bottom: -17px;
    height: 120px;
    width: 88px;
}

div.clown {
background: url(https://i.ibb.co/hWV7VfW/clown.gif) no-repeat;
position: fixed;
right: 0px;
height: 129px;
width: 88px;
}

body {
    background: url(https://i.ibb.co/0DGmvmf/slipknot-cover.png)  no-repeat fixed;
    background-size: cover;
    background-position: center;
}

main {
    background: #000000cc;
    color: white;
    padding: 0;
}

.logo {
content:url("https://i.ibb.co/GnKKL27/slipknot-logo.webp");
}

nav .top .left .logo {
    width: 96px;
}

nav .top {
    background: black;
    height: 120px;
}

nav .links, .profile .blurbs .heading, .profile .friends .heading, .profile .contact .heading, .profile .table-section .heading, .setting-section .heading, .home-actions .heading {
    background: linear-gradient(0deg, #400000, red);
    color: white;
    text-align: center;
}

.profile .friends .heading {
    margin-top: 20px;
}

.profile .blurbs .heading, .profile .friends .heading {
    border: 5px ridge black;
    border-bottom: none;
}

.profile .blurbs .inner, .profile .friends .inner, .blog-entry .comments .inner, .bulletin .comments .inner, .setting-section .inner {
    background: black;
    border: 5px ridge black;
    border-top: none;
}

.profile .contact, .profile .url-info, .profile .table-section, .setting-section, .home-actions {
    border: 5px ridge black;
    background: black;
}

table.comments-table {
    border: none;
}

a, .profile .friends .person p, .profile .blurbs .section h4 {
    color: #8c8c8c;
}

a:hover, .count {
    color: red;
}

nav .links a:hover {
    color: black;
    text-shadow: none;
}

.profile-info {
    background-image: url(https://i.ibb.co/3BxmCcC/surfacing.gif);
    height: 48px;
    width: 395px;
    border: none;
}

.profile-info .inner {
    display: none;
}

.profile h1, .profile .blurbs .section h4 {
   font-family: sickness;
   text-align: center;
   font-size: 2em;
}

main:before {
    height: 145px;
    display: block;
    content: "";
    background-image: url(https://i.ibb.co/hgf2k2r/slipknot-banner.png);
    background-position: center;
    background-size: cover;
}

.details-table td:first-child, .comments-table td:first-child, .music-table td:first-child {
    background: black;
    color: #8c8c8c;
    border: none;
}

.details-table td, .comments-table td, .music-table td {
    background: #520000;
}

.comments-table td {
    border: 2px solid black;
}

.comment-replies {
    border: 5px ridge black;
}

.profile .url-info:after {
    height: 100px;
    display: block;
    content: "";
    background-image: url('https://i.ibb.co/mSfKb0Z/slipknot-pixels.webp');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.award a {
    color: red;
}

.award a:hover {
    color: #930000;
}

.blog-preview:after {
    height: 63px;
    display: block;
    content: "";
    background-image: url('https://i.ibb.co/3Sh6kpy/slipknot.gif');
    background-repeat: no-repeat;
}

footer {
    background-color: #000000cc;
    color: red;
}

.online { visibility: hidden; } .online img { content: url("http://www.myspacegens.com/images/online_now/333.gif"); animation-name: none; visibility: visible; height: 20px; width: 80px; }

* {cursor: url(https://i.ibb.co/tPDwWF4/slipknot-cursor.png), auto !important;}


/* replace with cd image that has transparent background. must be 150px by 150px. */
:root {
--cd-image: url('https://i.ibb.co/WkPcdzv/slipknot-cd.png');
}
.profile-pic {
position: relative;
width: 183px;
filter: drop-shadow(0 0 0.25rem gray);
}
.profile-pic:after {
content: "";
background: url('https://fluorescent-lights.neocities.org/f0rzNHe.png'), linear-gradient(150deg, rgba(255,255,255,0.4), rgba(255,255,255,0.2), 40%, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0.6));
background-size: contain, cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.profile-pic:before {
content: "";
background: var(--cd-image);
position: absolute;
top: 5px;
left: -20px;
width: 150px;
height: 150px;
background-repeat: no-repeat;
z-index: -1;
animation-name: spin;
animation-duration: 5000ms;
animation-iteration-count: infinite;
animation-timing-function: linear; 
transition: left ease 0.5s;
}
.profile-pic:hover:before {
left: -75px;
}
@keyframes spin {
    from {
        transform:rotate(0deg);
    }
    to {
        transform:rotate(360deg);
    }
}
.profile-pic .pfp-fallback {
float: right;
width: 163px;
height: 160px;
border: none;
}
.general-about .profile-pic img {
max-width: inherit;
}

::-webkit-scrollbar { width: 16px; height: 10px; } 

::-webkit-scrollbar-thumb { background-color: #fff; background-image: url(https://i.ibb.co/NNj6dQg/retro-scrollbar-thumb.png); border-top: 1px solid #bdbdbd; border-left: 1px solid #bdbdbd; border-right: 1px solid black; border-bottom: 1px solid black; } 

::-webkit-scrollbar-track { background-color: #fff; background-image: url(https://i.ibb.co/rpqDr6p/retro-scrollbar-track.png); background-size: 3px; } 

::-webkit-scrollbar-button:vertical:increment { background-image: url(https://i.ibb.co/4VS5nfB/retro-scrollbar-increment.png); width: 14px; height: 16px; border-top: 1px solid #bdbdbd; border-left: 1px solid #bdbdbd; border-right: 1px solid black; border-bottom: 1px solid black; } 

::-webkit-scrollbar-button:vertical:decrement { background-image: url(https://i.ibb.co/xD64cwd/retro-scrollbar-decrement.png); border-top: 1px solid #bdbdbd; border-left: 1px solid #bdbdbd; border-right: 1px solid black; border-bottom: 1px solid black; width: 14px; height: 16px; } 
</style>

<iframe width="0" height="0" src="https://www.youtube.com/embed/O9gPQB0DUdM?si=R1oh_wn2CiQrdCogsi=1q7F5I_wZ2VJBGqg&;amp;;autoplay=1&;loop=1&;controls=1" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" loading="lazy">
&gt;</iframe></div></div>

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

ari	1714428086 using Report Comment
ari	1714356280 using Report Comment
salem	1714340565 Using Report Comment
salem	1714340561 Using Report Comment
sal	1714189521 usingg :D Report Comment
lay	1714189278 USINGG Report Comment
lay	1714074356 USINGG Report Comment
CL0WNGUTZ!!!	1713793601 using!! Report Comment
❦.♱ʚ♡ɞ♱❦.	1713503984 USING! LOVE IT Report Comment
Angel-Off	1713385849 i’m gonna use this! Report Comment
MetalHeart ☭	1713322994 I'm not using but I wanted to say that this is a cool layout Report Comment
Alex ☆	1713245234 USINNGNGN Report Comment
AlisakoRnlover	1713182512 THIS IS SO GOOD OMG Report Comment