blurryface layout

Tags: top
Description:

twenty one pilots themed .. pretty queer
Code:

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

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

<style>
body {
    background: url(https://i.pinimg.com/736x/19/3d/b3/193db312b746c19e27c2ba0ecbe42314.jpg);
background-position:center center;
background-size:contain;
}
main {
background-color:rgba(2, 0, 0, 0.90);
border: inset red 1px;
border-radius:10px;
box-shadow: 1px 1px 40px 10px;
}
</style>
<style>
:root {
        text-shadow: 0px 1px 4px rgba(255, 0, 0, 0.29);
        --logo-blue: ;
        --darker-blue: ;
        --lighter-blue: ;
        --even-lighter-blue: ;
        --lightest-blue: ;
        --dark-orange: ;
        --light-orange: ;
        --even-lighter-orange: ;
        --green: ;
    }
</style>
<style> 
/* these are the colors for headers */
 @import url('https://fonts.googleapis.com/css2?family=Castoro+Titling&display=swap');
p{
font-family: 'Castoro Titling', sans-serif;
text-transform:uppercase !important;
color:#ffedf9;
}
</style>
<style>
/* this adjusts the size/font of your name */
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@200&display=swap');
h1{
font-size: 35px !important;
font-family: 'Nunito', cursive;	
text-transform:uppercase !important;
padding-left: 2px !important;
}
</style> 
<style> 
/* this changes the color of your name */
.profile h1{
background: -webkit-linear-gradient(rgba(23, 53, 75, 1), darkred);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
</style>
<style>
/* this changes the color of your headers */
@import url('https://fonts.googleapis.com/css2?family=PT+Mono&display=swap');
h4{
font-size: 15px !important;
font-family: 'Nunito', sans-serif;	
text-transform:uppercase !important;
padding-left: 1px !important;
/* gradient text, you can replace existing colors with whatever ones you want */
background: -webkit-linear-gradient(rgba(59, 89, 102, 1), red);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;

}
</style> 
<style>
/* links in the navigation bar @ the top */
nav{ 
font-size: 13px !important;
font-family: 'Nunito', sans-serif;
text-shadow: 1px 1px black;
text-transform:none;
padding-left:3px;
text-align: center;
}
</style>
<style>
/* this is what makes the text bold/look bigger */
p{
font-size: 14px !important;
font-weight: bold;
 text-transform:none !important;
}
</style> 
<style>
/* this is what makes the text bold/look bigger */
h4{
font-size: 20px !important;
}
</style> 
<style>
/* this centers your friend space */
    .profile .friends .inner, .profile .blurbs .section h4{
    text-align: center;
    }
</style>
<style>
/* the color of the number of your friends */
    .count {
        color: darkred;
    }
</style>
<style>
/* link colors when you hover over links */
   a:hover {
     color: rgba(112, 24, 24, 1); 
   } 
   a{
     color: rgba(186, 48, 48, 1); 
   }
</style>
<style>
/* this is the background color for the headings of your blurbs, friend space + comments */
.profile .blurbs .heading, .profile .friends .heading {
color: white;
background-color:rgba(147, 0, 0, 0.1);
text-transform:lowercase !important;
color: white;

border: 2px outset darkred;
}
</style>
<style>
/* links to your friends' profiles */
.profile .friends .person p {
color: rgba(255, 23, 23, 1);  
}
.profile .friends .person p:hover {
color: grey;  
}
</style>
<style> 
/* this is the box that says "_'s latest blog entries" */
@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@700&family=Roboto:wght@700&display=swap');
DIV.blog-preview{
text-align: center;
font-family: 'Josefin Sans', sans-serif;
background-color:rgba(56, 0, 0, 0.11);
text-transform:lowercase !important;
color: white;
border: 1px outset darkred;
}
</style>
<style>
/* these are the colors for the table headings on the left */
.profile .contact .heading, .profile .table-section .heading, .home-actions .heading {
background-color: rgba(106, 0, 0, 0.29);
}
</style>
<style>
/* contacting "_" */
.profile .contact {
background-color: rgba(0, 0, 0, 0.29);
border: outset darkred 1px;
}
</style>
<style>
/* friend comments */
.profile .friends .comments-table td {
background-color: rgba(0, 0, 0, 0.29);
border: 1px solid red;  
}
.comments-table td*{
    
    
}
</style>


<style>
/* colors for interest section */
.profile .table-section .details-table td {
background-color:rgba(0, 0, 0, 0.29);
border: outset darkred 1px;
}
</style>
<style>
/* navigation bar at the top/the bar that has navigation links */
nav .links {
background-color: transparent;
}
nav .links a:hover {
color: red;
}

</style>
<style>
}
.general-about{ position: relative;
margin-top: 30px; } .general-about .profile-pic::before{ content: ''; background: url('https://vignette.wikia.nocookie.net/fj-items-database/images/d/d7/Copper_saw.gif/revision/latest?cb=20150123084424') no-repeat; background-size: cover; display: block; width: 100px; height: 100px; z-index: 999; position: absolute; top: -43px; left: -32px; 
  }
    .blurbs {
        color: white;
text-align: center;
    }
</style>
<style>
.mood:after {
  content: "";
  white-space: pre-wrap;
  display: block;
  height: 50px;
  background-image: url(https://64.media.tumblr.com/7aadf715a41d1da797400c3423f8eac8/aa7fb8520bfd9e0a-0f/s250x400/973580e06bbeba818cd6f507138b518f3678762f.gifv);
  background-position-x: center;
  background-repeat: no-repeat;
  background-size: 300px;
}
.online{
  content: url("https://www.myspacegens.com/images/online_now/144.gif");
} 
.blurbs .inner {
  text-align: center !important;
}
.url-info {
  display: none;
}
#comments {
  height: 400px;
  overflow-y: scroll;
}
.blurbs {
        height: 300px!important;
        overflow-y: scroll;
    }
.table-section {
        height: 400px!important;
        overflow: auto;
    }
to customize the uhmm scrollbar itself its 
::-webkit-scrollbar {
width: 9px;
height: 9px;
}
 
::-webkit-scrollbar-track {
background: white;
border-radius: 3px;
}
 
::-webkit-scrollbar-thumb {
border-radius: 4px;
background: #ff2676; 
}
 
::-webkit-scrollbar-thumb:hover {
background:red;
}
</style>
<style>
img:hover {
animation: shake 2s infinite;
filter: blur(2px);
}
@keyframes shake{
    0% {
        transform:translate(1px,1px) rotate(0deg);
    }
 
    10% {
        transform:translate(-1px,-2px) rotate(-1deg);
    }
 
    20% {
        transform:translate(-3px,0px) rotate(1deg);
    }
 
    30% {
        transform:translate(3px,2px) rotate(0deg);
    }
 
    40% {
        transform:translate(1px,-1px) rotate(1deg);
    }
 
    50% {
        transform:translate(-1px,2px) rotate(-1deg);
    }
 
    60% {
        transform:translate(-3px,1px) rotate(0deg);
    }
 
    70% {
        transform:translate(3px,1px) rotate(-1deg);
    }
 
    80% {
        transform:translate(-1px,-1px) rotate(1deg);
    }
 
    90% {
        transform:translate(1px,2px) rotate(0deg);
    }
 
    100% {
        transform:translate(1px,1px) rotate(0deg);
    }
 
}
</style>

<iframe width="0" height="0" src="https://www.youtube.com/embed/_uQQF7S6DII//?&;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">
</iframe>
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 5 of 5 comments ( View all | Add Comment )
Luna	1711708305 OH MY GOD DEF USING Report Comment
W1lbur >:3	1710059932 HOLY SHITT IM GONNA USE THIS :D Report Comment
Solar	1708105446 using!! Report Comment
Z3r0 XD!!	1698066417 using før my bløg!! Report Comment
Ciel! ⁠☆	1697569334 USINGG GOMGIENRIFER Report Comment