Space (hey) Layout

Tags: space, dark

Description:

made this thing for myself, but now you can have it too just beware because the code is quite a mess but i'll try to make sense out of it if you need any help with a layout or whatever, try texting me if there's any problem in the code, also try texting me

Preview:

click on the image for a larger preview

Code:

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

<style>

/* these are the fonts used */

@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Crimson+Text:wght@600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Zeyada&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cutive+Mono&family=Pirata+One&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Road+Rage&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Redacted+Script:wght@300&display=swap');



h1{font-family: 'Road Rage', sans-serif;
color:white;}

.profile .blurbs .section h4 {color:#ff8eff;}

.profile h1 {text-align:center;
font-size:40px}


body{font-family:'Cutive Mono', monospace;
background:url(https://64.media.tumblr.com/6fa9ad9f859cf058bfe19a2536b0aa11/tumblr_pkv647vWBM1xp1j77o1_540.gif);
background-size:cover;
cursor:url("http://www.rw-designer.com/cursor-set/windows-7-aero-1"),auto;}

.comment-replies {border: 1px dotted white;}

div.inner b {animation: glow 1s ease-in-out 0s infinite ;}

.profile{background:black;
color:white;
padding:20px;
animation: mover 5s ease-in-out 0s infinite alternate;}

div.top{background:black;
border:1px dashed white;
border-radius:30px;
margin:20px;
animation: moverss 5s ease-in-out 0s infinite alternate;}

footer{background:black;
color:white;
animation: movers 5s ease-in-out 0s infinite alternate;}

main{background:black;}

.links{background-image: linear-gradient(white, black, white);
border-radius:20px;
animation: movers 5s ease-in-out 0s infinite alternate;}

p.online{color:white;
font-family: 'Zeyada', cursive;}

div.contact{background:black;
color:white;}

img.pfp-fallback{filter: drop-shadow(0px 0px 30px white) invert(5%);
animation: spin 1s ease-in-out 0s infinite alternate;
border:3px solid black;}

img.pfp-fallback:hover{filter: drop-shadow(0px 0px 10px magenta) invert(5%);}

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

.profile .contact .heading{border: 1px solid #ffffff;
background:black;}

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

.profile .table-section{border: 2px solid #ffffff;
background:black;}

.profile .table-section .heading{border: 1px solid #ffffff;
background:black;}

td{border: 1px solid #ffffff;
background:black;
padding:0px;}

p{background:black;
color:white;}

.details-table td p{text-align:center;}

.details-table td:first-child{background:black}

.details-table td{background:black;}

a{color:magenta;}

.profile .blurbs {border:1px solid white;}

.profile .blurbs .heading{background:black;
border-bottom:1px dotted white;}

.profile .friends{border:1px solid white;}

.profile .friends .heading{background:black;
border-bottom:1px dotted white;}

.profile .friends .person p:hover {color:white;
filter: drop-shadow(0px 0px 5px white);}

h4{color:white}

main .right {border:1px dashed white;}


main .left {border: 1px dashed white;}


.comments-table td, .music-table td {background:black;}

.comments-table td:first-child, .music-table td:first-child {background:black;}

@keyframes spin {
    from {
        transform:rotateY(0deg) translateY(10px);
    }
    to {
        transform:rotateY(180deg) translateY(-10px);
    }
}



@keyframes mover{
    from {
        transform:translateX(60px);
    }
    to {
        transform:translateX(-60px);
    }
}

@keyframes movers{
    from {
        transform:translateX(25px);
    }
    to {
        transform:translateX(-25px);
    }
}


@keyframes moverss{
    from {
        transform:translateX(15px);
    }
    to {
        transform:translateX(-15px);
    }
}

@keyframes glow{
  0%   {background-color: red;}
  14%  {background-color: yellow;}
  28%  {background-color: blue;}
  42% {background-color: green;}
  56%   {background-color: red;}
  70%  {background-color: yellow;}
  84%  {background-color: blue;}
  100% {background-color: green;}
</style>


/*this makes it play music */

<iframe width="0" height="0" src="https://www.youtube.com/embed/OW9sFOw_8zo//?&;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 20 of 36 comments ( View all | Add Comment )

m3t	1755971238 using probably idk Report Comment
Agatka Band (ᗒᗣᗕ)՞	1754636068 usingg Report Comment
EvilJod	1754567179 usingg :0 Report Comment
≡;- ꒰ °Fainted Fairy!!꒱	1752691120 Using!! Report Comment
Alexandra ˃͈◡˂͈	1752349117 using!!!! Report Comment
Kazz	1752327911 USINGG THANK YOU SO MUCHH Report Comment
4mnq	1748792908 usiiing Report Comment
sogg	1746273860 using!!! Report Comment
𝘮𝘢𝘰𝘴 𓆩♡𓆪	1744958484 using for my diary blog ^^ Report Comment
ᴠɪᴠɪ :>	1744753249 using! <3 Report Comment
ᴠɪᴠɪ :>	1744753249 using! <3 Report Comment
Mar	1743299794 Using :) Report Comment
frushi	1741105174 I think I will use it Report Comment
Kyle :3	1739090995 using Report Comment
FIZZY !	1739080123 Using!! Report Comment
CESAR!1!	1737892220 using Report Comment
Aveloveline	1737312046 using Report Comment
hor66	1736627630 using!! Report Comment
Popbal	1736010698 THANKS YALL WHO USE THIS LAYOUT I APPRECIATE YOU <33333 !!!!!! Report Comment