Simple Red Star Themed Layout

Tags: red, starlayout, 2000s, emo, scene, layout, music

Description:

A simple red layout I created, you don't need to credit me or anything this is for fun :D | Preview on my profile | Background Song: Paramore - That's what you get | comment if u used it, id love to see it!!

Code:

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

<font color="#26ff05" size="5"><marquee>NEW LAYOUT! PREVIEW HERE :).</marquee></font>

<style>
p {
font-size: 22px;
text-align: center;
}
</style>



<style>
/*EVERYTHING BUT THE JIGGLE EFFECT AND THE DOMO CURSOR IS MINE*/

/* You dont have to credit me, take it and edit it as you please :D. ps. im not a crazy good css/html coder so it might be a little poopoo */

  @import url('https://fonts.googleapis.com/css2?family=Permanent+Marker&display=swap');
body{font-family: 'Permanent Marker', cursive;}
</style>

<style>
body{
background: url("https://i.pinimg.com/564x/82/e3/89/82e389a841aca71bec91105026869099.jpg")
}
.profile{
background: url("https://i.pinimg.com/564x/4b/1e/f0/4b1ef06ceaba4196207faf83ee2cd6d3.jpg")
fixed;
color: gold;
text-shadow: 2px 1px black;



}
.profile .blurbs .heading,
.profile .table-section .heading,
.profile .contact .heading,
.profile .friends .heading{
background-color: darkred;
}
.profile .contact .heading,
.profile .table-section .heading{
background-color: darkred;
}


:root {
        --logo-blue: ;
        --darker-blue: salmon;
        --lighter-blue: ;
        --even-lighter-blue: indianred;
        --lightest-blue: lightcoral;
        --dark-orange: orange;
        --light-orange: indianred;
        --even-lighter-orange: salmon;
        --green: maroon;
 }
main{
background-color: transparent;
 background: rgba(1,1, .1) !important;
 color: white;
border: black 10px solid;
border-radius: 16px;
.profile .friends .person img:not(.icon) {
border: 6px double rgba(239, 17, 17, 0.63)
}
.profile-pic {
border-radius: 500px;
overflow: hidden; 
 
}
.profile .friends .person img {

border-radius: 500px;
}
.profile .contact, .table-section, .profile .url-info, .profile .friends, .profile .blurbs, table.comments-table, DIV.blog-preview { 
  border-style:ridge; 
 border-width:6px; 
 border-color:#e8000f; 
border-radius:6px;
background-image: url("https://i.pinimg.com/564x/a6/03/14/a603143cd5568406be843e976924697f.jpg")
}

</style>

<style>
footer {
background-image: url("https://i.pinimg.com/564x/a6/03/14/a603143cd5568406be843e976924697f.jpg");
}
</style>

<style>



h1{


animation: type 3s steps(27);
  }



@keyframes type{

  0%{

    width:0ch;

  }

  

  100%{

    width:27ch;

  }

}



@keyframes blink{

  0%{opacity:1;}

  50%{opacity:0;}

  100%{opacity:1;}

}



.col, main, footer, nav::before, .online, nav .links, nav .top {

animation: float 4s;

animation-iteration-count: infinite;

animation-timing-function: ease-in-out;

}



.col, main, footer, nav::before, .online, nav .links, nav .top {

animation: float 4s;

animation-iteration-count: infinite;

animation-timing-function: ease-in-out;

}

@keyframes float {

0% { transform: translate(0, 0px);

}

50% {

transform: translate(0, 8px);

}

100% {

transform: translate(0, -0px);

}



</style>

<style>

img:hover , .url-info:hover , .online:hover {

  animation: shake 1s;

  animation-iteration-count: infinite;

}



@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, -2px) rotate(-1deg); }
}
.profile h1 { font-family: cursive Display;
font-size:40px;
color: #ffffff; 
text-shadow: 2px 3px red;

</style>

<style>* {cursor: url(https://cur.cursors-4u.net/anime/ani-11/ani1092.cur), auto !important;}</style><a href="https://www.cursors-4u.com/cursor/2011/03/20/domo-kun-staring.html" target="_blank" title="Domo-kun Staring"><img src="https://cur.cursors-4u.net/cursor.png" alt="Domo-kun Staring" style="position:absolute; top: 0px; right: 0px;"/></a>


/*PUT THIS IN GENERAL UNDER INTEREST FOR MUSIC*/

<iframe width="0" height="0" src="https://www.youtube.com/embed/1kz6hNDlEEg?&;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>


/*Tutorial on how to change the song https://forum.spacehey.com/topic?id=98324*/

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

bugb1te	1735350825 using !! Report Comment
Caz	1735236359 Usinggg Report Comment
yxxxchpop	1734649338 usinggggggg Report Comment
juliiann ✮⋆˙✧๋࣭ ⭑	1733255132 lo amooooooo usando!!!!! Report Comment
Kashew! 𝄞⨾𓍢ִ໋🎧ྀི	1732586973 i lokey love this!! usinggg Report Comment
d.	1719562628 using, might change some things a bit:p Report Comment