Helluva Boss Layout

Tags: helluva boss, autoplay, cursor, contact icons, online, red, layout

Description:

i had this idea for a little bit, and was surprised to see no one else made a helluva boss layout so i made one myself ! The codes easy to change if you know what your doing so go crazy!! Theres autoplay, a custom cursor, custom contact icons, and custom online text.

Preview:

click on the image for a larger preview

Code:

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

replace with about me !

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

<style>
  font-size: 150%;
}
h1,h2,h3,h4,h5{
  font-size: 200%; 
}
  body {
   background-image: url(https://pbs.twimg.com/media/EtIW7KHXcAAHt8u?format=jpg&name=4096x4096);

}
.profile {
   background-color: rgb(94, 37, 37); 
}
/* change all headings on page to different colors. */
  .profile .blurbs .heading,
  .profile .friends .heading{
   background-color: rgb(147, 25, 25);
   color: #d51c17;
}
/* change all headings on page to different colors. */
  .profile .contact .heading,
  .profile .table-section .heading{
   background-color: #931919;
   color: rgb(213, 28, 23);
}
main {
    background: #5e2525;
    color: #d51c17;
    padding: 0px 0px;
    font-size: 80%;
}

html:before {

  content: " ";

  display: block; position: fixed;

  top: 0; left: 0; bottom: 0; right: 0;

  background: linear-gradient(rgba(213, 28, 23, 0.17) 50%, rgba(147, 25, 25, 0.39) 50%);

  z-index: 2;

  background-size: 100% 2px, 3px 100%;

  pointer-events: none;

}
main:before {
    width: auto;
    margin-bottom: 10px;
    border: 0px solid black;
    height: 250px;
    display: block;
    content: "";
    background-image: url(https://64.media.tumblr.com/fd694141ff29c7aa97534c96456c67ee/e5a4788d47c8b9ca-d2/s540x810/71ba6769060a1bfb30130c38062ad0e3479eec7e.gif);
    background-position: center center;
    background-size: cover;
}
footer {
    border-radius: 15px;
    background-image: url(https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQVDWJliVA35R1nPOmmCs7fz9yevthlcrpcs1_RFCzGI3S9aMvcIDVZG0Czu7vj2n0Ad8s&usqp=CAU);
    color: white;
}

table.comments-table td {
    color: rgb(insert rgb);
}

:root {
    --logo-blue:#d51c17;
    --darker-blue: #d51c17;
    --lighter-blue: #d51c17;
    --even-lighter-blue: ;
    --lightest-blue: ;
    --dark-orange: #d51c17;
    --light-orange: #931919;
    --even-lighter-orange: #931919;
    --green: pink;
}
</style>

<style>
*{
  border-radius: 9px;
}
.profile .contact .heading, .profile .table-section .heading, .home-actions .heading{
  border-radius: 6px 6px 9px 9px;
}
.profile .contact{
  text-align: left;
}
.contact .inner a img{
  font-size: 0;
}
.contact .inner a img:before{
  font-size: 1em;
  display: block
}
/*ADD TO FRIENDS*/
.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before{
  content: "⛧"
}
/*ADD TO FAVS*/
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before{
  content: "⛧"
}
/*SEND MSG*/
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before{
  content: "⛧"
}
/*FORWARD TO FRIEND*/
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before{
  content: "⛧"
}
/*INSTANT MESSAGE*/
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before{
  content: "⛧"
}
/*BLOCK USER*/
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before{
  content: "⛧"
}
/*ADD TO GROUP*/
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before{
  content: "⛧"
}
/*REPORT USER*/
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before{
  content: "⛧"
}
</style>

<style>
    p.online {font-size: 0px;}
p.online::after{content: "custom online here";
color: #d51c17;
font-size: 10px;}
    </style>

<style>



    table.comments-table{
        

border: 10px #d51c17 !important;   

        

    }

</style>

<style>
  
  .logo {
  
  content:url("https://cdn.discordapp.com/attachments/1058871949524217856/1145151724718407780/2023_08_26_0xz_Kleki.png")
  
  }
  
  </style>

<style>
*{cursor: url(http://www.rw-designer.com/cursor-view/154420.png), auto !important}
</style>

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

G̵̬̀̊͝ĺ̶͎̙̚͝i̴̺̮̳̅t̸̫̔̽̕̚c̵̡̡͔̟̑͠h̸͓̱̾	1713114841 Using:DD Report Comment
✪Maj0^_^	1712451954 USINGGG (i love it smch) Report Comment
fluttershy .	1707949541 USING THIS!! I LOVE UR IDEA :DD Report Comment
lynn	1707371281 USING!! :3 Report Comment
Rocky ☾☆☽	1707207359 Attempting to use! Report Comment
Stolashoothoot	1703662507 Using this Report Comment
Flare!!	1701991969 attempting to use Report Comment
‧˚꒰SOPHIE꒱༘⋆	1697819377 Using Report Comment
Vivziepop	1695970041 Love it!!! :D Report Comment
kokomo!	1695186520 using!! ^^ Report Comment
Sutart_chill	1693256261 I'm using this! It's cool Report Comment