Purple Space ✧･ﾟ: ✧･ﾟ:

Tags: space, moon, astronaut, purple, nebula, stars, animated, earth, layout, cool

Description:

I kindaaa made this :P Comment if you use <3^^ it has space background music

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by  .·:*¨𝘗𝘦𝘢𝘯𝘶𝘵¨*:·. (https://layouts.spacehey.com/layout?id=26249) -->

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

</iframe>



<style>main:before {
	width: 100%;
	height: 600px ;
	display: block;
	content: "";
	background-image: url('https://media3.giphy.com/media/l3c614V12UA82q1vG/giphy.gif?cid=ecf05e475x3zh8z6rew3acpc8dsm15saqchi3rw1nxju4oz1&rid=giphy.gif&ct=g');
	background-position: center center;
	background-size: cover;
}
@media only screen and (max-width: 600px) {
	main:before{
		height: 200px;
	}
}</style>



<style>
html:before {
  animation: grain 8s steps(10) infinite;
  background-image: url('https://dl4.glitter-graphics.net/pub/3549/3549294n1zkm6swm7.gif');
  content: "";
  height: 300%;
  left: -50%;
  opacity:.2;
  position: fixed;
  top: -110%;
  width: 300%;
  pointer-events:none;
}
@keyframes grain {
  0%, 100% { transform:translate(0, 0) }
  10% { transform:translate(-5%, -10%) }
  20% { transform:translate(-15%, 5%) }
  30% { transform:translate(7%, -25%) }
  40% { transform:translate(-5%, 25%) }
  50% { transform:translate(-15%, 10%) }
  60% { transform:translate(15%, 0%) }
  70% { transform:translate(0%, 15%) }
  80% { transform:translate(3%, 35%) }
  90% { transform:translate(-10%, 10%) }
} </style>





<style>
body{background:url("https://i.imgur.com/sVydnQy_d.webp?maxwidth=760&fidelity=grand") no-repeat fixed; background-size:cover;}



</style>



<!-- (c) Layout created by KασKασ ♥ (https://layouts.spacehey.com/layout?id=21260) -->

<style>
/*Main Body Background Image*/
    body{
    background-image: url(https://i.imgur.com/oADKzWV_d.webp?maxwidth=760&fidelity=grand) !important;
    background-attachment: FIXED !important;
    background-repeat: NO-REPEAT !important;
    background-position: CENTER !important;
    background-size: COVER;}
</style>
    
<style>
/*Profile Color*/
    main{
    background-color: #00000095 !important;
</style>
    
<style>
/*Adding rounded corners to profile*/
   .top{
        border-radius: 25px 25px 25px 25px !important;}
        
    main{
        border-radius: 25px 25px 25px 25px !important;}
</style>
        
<style>
/*Top Background Color*/
   .top{
    background-color: #00000065 !important;
</style>
    
<style>
/*Top Links Background Color*/
 .links{
     text-align:center;
    background-color: transparent !important;
</style>

<style>
/*Search Users Box Background Color*/
    .top input{
    background-color: #a17164 !important;
</style>

<style>
/*Buttons*/
    button{
    border-radius: 25px 25px 25px 25px !important;
    background-color: #d7b2ae !important;
</style>

<style>
/*Profile Name Background Color*/
    h1{
    text-align:center;
    border-radius: 25px 25px 25px 25px !important;
    background-color: #EDAB95 !important;
</style>

<style>
/*Mood */
    .mood{
    text-align:center;
    border-radius: 25px 25px 25px 25px !important;
</style>

<style>
/*Contact Heading Background Color*/
    .contact .heading{
    border-radius: 25px 25px 25px 25px !important;
    background-color: transparent !important;
</style>

<style>
/*Contact Box Background Color*/
    .contact{
    background-color: transparent !important;
</style>

<style>
/*Interests Section/Social Links Heading Background Color*/
    .table-section .heading{
    border-radius: 25px 25px 25px 25px !important;
    text-align:center;
    background-color: #EDAB95 !important;
</style>

<style>
/*Interests Table & Links Table Background Color*/
    table.details-table{
    background-color: COLOR !important;
    background-image: url('URL') !important;
    background-attachment: FIXED OR SCROLL !important;
    background-repeat: REPEAT OR NO-REPEAT !important;
    background-position: CENTER / LEFT / RIGHT / TOP / BOTTOM !important;}
    
    .profile .details-table td{
    background-color: #00000065 !important;
    background-image: url('URL') !important;
    background-attachment: FIXED OR SCROLL !important;
    background-repeat: REPEAT OR NO-REPEAT !important;
    background-position: CENTER / LEFT / RIGHT / TOP / BOTTOM !important;}
</style>

<style>
/*Blurbs Heading Background Color*/
    .blurbs .heading{
    border-radius: 25px 25px 25px 25px !important;
    background-color: #EDAB95 !important;
</style>

<style>
/*Hide "About Me" & "Who I'd Like To Meet" Headers*/
 .blurbs .section h4{display: none !important;}
</style>

<style>
/*Friends/Comments Heading Background Color*/
    .friends .heading{
    border-radius: 25px 25px 25px 25px !important;
    background-color: #EDAB95 !important;
</style>

<style>
/*Comments Background/border Color*/
    .comments-table td{
    background-color: transparent !important;
    border-radius: 25px 25px 25px 25px !important;
    border-color: transparent;
    }
</style>

<style>
/*Put Your Comments In A Scroll Box*/
.comments-table {
    display: block;
    height: 300px!important;
    overflow-y: scroll;
    border: 0px solid black !important;
    outline: none !important;
    border-radius: 25pxpx;
    padding:5px;
    border-spacing: 4px;
    text-align: center;
}
.comments-table td * {
    border-radius: 25px 25px 25px 25px !important;
}
</style>

<style>
/*Customize Scrollbar*/
    ::-webkit-scrollbar {
    width: 1px;
    height: 10px;}

    ::-webkit-scrollbar-thumb {
    background: rgba(80, 80, 80);}

    ::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.2);}
</style>

<style>
/*spacehey logo color.
you can change it at https://codepen.io/sosuke/pen/Pjoqqp */
nav img.logo{
    filter: invert(48%) sepia(44%) saturate(766%) hue-rotate(321deg) brightness(76%) contrast(94%);
}
</style>

<style>
/*Footer Links Background Color*/
    footer{
    background-color: #00000075 !important;
</style>

<style>
/*Change Text Colors*/
    .top{
    color: #D48969;}    
    
    main{
    color: #C9705C !important;}
    
    footer{
    color: #FFFFFF;}
</style>

<style>
/*Change Link Colors*/
    a{
    color: #F0B1A3 !important;}
    
    a:hover{
    color: #F08E7E !important;}
    
    .top a{
    color: COLOR !important;}
    
    .top a:hover{
    color: COLOR !important;}
    
    .top a:visited{
    color: COLOR !important;}
    
    .links a{
    color: COLOR !important;}
    
    .links a:hover{
    color: COLOR !important;}
    
    .links a:visited{
    color: COLOR !important;}
   
    .friends-grid p{
    color: #F7A6A7 !important;}

    footer .links a{
    color: COLOR !important;}
   
    footer .links a:hover{
    color: COLOR !important;}
   
    footer .links a:visited{
    color: COLOR !important;}
</style>

<style>
/*Change Interests Section Titles*/
table, th, td {
  border: 0px trans;text-align:center;border-radius: 15px; }

:root {
  --topic1: " ⋆ ✧Games 🢚";
  --topic2: " ⋆ ✧Music 🢚";
  --topic3: " ⋆ ✧Movies 🢚";
  --topic4: " ⋆ ✧TV 🢚";
  --topic5: " ⋆ ✧Books 🢚";
  --topic6: " ⋆ ✧Heroes 🢚";}

.table-section:not(:last-child) .details-table tr td:first-child p{color:transparent !important;text-shadow: white !important;letter-spacing: -100px;}

.details-table tr td:first-child p::after{
color:#C4402E(--links) !important;
letter-spacing:normal !important;
text-shadow: 2px 2px #C4402E !important;
filter: brightness(95%) !important;}

.table-section:not(:last-child) .details-table tr:nth-child(1) td:first-child p::after{
  content: var(--topic1);}

.table-section:not(:last-child) .details-table tr:nth-child(2) td:first-child p::after{
  content: var(--topic2);}

.table-section:not(:last-child) .details-table tr:nth-child(3) td:first-child p::after{
  content: var(--topic3);}

.table-section:not(:last-child) .details-table tr:nth-child(4) td:first-child p::after{
  content: var(--topic4);}

.table-section:not(:last-child) .details-table tr:nth-child(5) td:first-child p::after{
  content: var(--topic5);}

.table-section:not(:last-child) .details-table tr:nth-child(6) td:first-child p::after{
  content: var(--topic6);}
</style>

<style>
/*Follow font instructions at: https://forum.spacehey.com/topic?id=6530  */
/*Change normal text font*/
.body{
font-family: 'Roboto Condensed', sans-serif;}
</style>

<style>
/*Change link font*/
a{
font-family: 'Roboto Condensed', sans-serif;}

a:hover{
font-family: 'Roboto Condensed', sans-serif;}

a:visited{
font-family: 'Roboto Condensed', sans-serif;}
</style>

<style>
/*Change Profile Name Font*/
h1{
font-family: 'Roboto Condensed', sans-serif;}
</style>

<style>
/* this centers your friend space */
    .profile .friends .inner, .profile .blurbs .section h4{
    text-align: center;
    }
</style>

<style>
/* cursors: top URL is the cursor that shows when you hover over links, bottom URL is the main or "resting" cursor */
/* https://cursors-4u.net */
a:hover {    
 cursor: url(https://cur.cursors-4u.net/nature/nat-7/nat607.cur), auto;
}
* {
 cursor: url(https://cur.cursors-4u.net/nature/nat-7/nat607.cur), auto;
}
</style>

<style>
/* this edits your friends' icons */
.profile .friends .person img:not(.icon) {
border-radius:15px;
box-shadow: 1px 0px 7px 2px rgb(255, 153, 153);
}
</style>

<style>
/* contact icons */
.contact .inner a img {
font-size: 0;
}
.contact .inner a img:before {
font-size: 1em;
display: block
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {
/* add to friends */
content: "✨"
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
/* add to favorite */
content: "💫"
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
/* send a message */
content: "☄️"
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
/* foward to friend*/
content: "🌌"
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
/* instant message */
content: "🪐"
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
/* block user */
content: "🚀"
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
/* add 2 group  */
content: "🛸"
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
/* report */
content: "👽"
}   
</style>

<style>
/*Rounds profile picture*/
    .profile-pic img{
border-radius:25px;}
</style>

<style>
/*Change Header Text (Contact, About Me, Who I'd Like To Meet, etc)*/

/*"Contacting You" Box Title*/
.contact .heading{ font-size:0; text-align:center; }
.contact .heading:before{ content: "⬐Click Here⬎"; font-size:.9rem; font-weight:bold;color:#FFCABC; }

/*"Your Blurbs" Title*/
.blurbs .heading{ font-size:0; text-align:center;}
.blurbs .heading:before{ content: "About Me"; font-size:.8rem; font-weight:bold;color:#610027; }

/*"Your Friend Space" Title*/
.friends .heading{ font-size:0; text-align:center;}
.friends .heading:before{ content: "My Buddies"; font-size:.8rem; font-weight:bold;color:#610027; }

/*"Your Friend Comments" Title*/
.friends#comments .heading{ font-size:0; text-align:center; }
.friends#comments .heading:before{ content: "Leave a Message"; font-size:.8rem; font-weight:bold; }
</style>

<style>
/*Unbold All Links On Your Profile*/
     a{
     font-weight: normal !important;}
     
     a:visited{
     font-weight: normal !important;}
     
     a:hover{
     font-weight: normal !important;}  
     
    .top a{
        font-weight: normal !important;}
    
    .top a:hover{
        font-weight: normal !important;}
    
    .top a:visited{
        font-weight: normal !important;}
    
    .links a{
        font-weight: normal !important;}
    
    .links a:hover{
        font-weight: normal !important;}
    
    .links a:visited{
        font-weight: normal !important;}
    
    .profile a{
        font-weight: normal !important;}
    
    .profile a:hover{
        font-weight: normal !important;}
    
    .profile a:visited{
        font-weight: normal !important;}
    
    footer a{
        font-weight: normal !important;}
    
    footer a:hover{
        font-weight: normal !important;}
    
    footer a:visited{
        font-weight: normal !important;}
    
    .supporter{
    font-weight: normal !important;}
</style>

<style>
/*contact box border*/
    .contact{
border: 1px transparent !important;
border-radius: 15px;}
</style>

<style>
/* for this box, you can add an image of your choice. it's right under the contact box. */
.url-info{
    background: url(https://64.media.tumblr.com/tumblr_md6n2xT8R41rnwo2vo1_400.gifv) no-repeat;
    background-position: center;
    background-size: 100%!important;
    border: var(--borders)!important;
    border-radius: 15px;
    height: 500px;}
https://genericprofileeditor.neocities.org/profile?id=6326
.url-info p{
    opacity: 0.0;}
</style>

<style>
/*removes blue boxes around the interests/links table*/
body  
    {
--lighter-blue: none;
}
</style>

<style>
/*Centering Text and Images in Blurbs Section*/
.blurbs .inner{

text-align: center !important;

}
</style>

<style>
/* the color of the number count of your friends/comments */
    .count {
        color: #F7A6A7;
    }
</style>

<style>
/*Interests and links table header text color*/
    .profile .table-section .heading h4 {
        color: #610027;
    }
</style>

<style>
/*Hides "XXX is your friend" Box*/
.profile-info{display: none !important;}
</style>

<style>
/*Hides Blogs*/
.blog-preview{
color: #F7A6A7;
}
</style>

<style>
/*Change "Online Now" Icon*/
.online{

content: url(https://i.imgur.com/c1C0kqh.gif) !important;
    height: 20px;
    width: 150px;
}
</style>


<div class="image"></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 17 of 17 comments ( View all | Add Comment )

jay :pp	1713366643 probaply using:3 Report Comment
jay :pp	1713366638 probaply using:3 Report Comment
jay :pp	1713366634 probaply using:3 Report Comment
Fizzy_Red_Soda	1691358629 might use Report Comment
Fizzy_Red_Soda	1691358502 might use Report Comment
☆•Renee•☆	1682106054 I absolutely adore and love this layout! Using!! Report Comment
Raine	1680067046 Just put it on my profile! it is so cool. The music caught me off guard big time though, lol. Report Comment
⋆.ೃ࿔*:･ ⟡ Bee ⟡	1680028201 OHMJYVGODS i lobe this soo much. screams. It’s amazing. definitely using it!! :)) Report Comment
SAMMY	1679980214 I LOVE IT SM, YOU DID AMAZING ON IT <3 Report Comment
static	1679969538 this is so frickin cute im using Report Comment
BroOk3	1679711826 this is awesome! def using! thanksss!!! Report Comment
✨yorvmvrasaki✨	1677689106 I’m using it! However, the nebula image on top won’t show, how can I fix it? Thank u <3 Report Comment Nevermind, it’s showing now! Also it’s a gif THAT’S SO COOL OMG. Works perfectly, thank u! by ✨yorvmvrasaki✨; 1677689182; Report Glad it works for you! :)) by *.·:¨𝘗𝘦𝘢𝘯𝘶𝘵¨:·.*; 1677711293; Report
Funky Alien	1677548809 This is perfect! I'm using it Report Comment
Diana	1676530013 Using. Very soothing and lovely, thank you for sharing. Also, hope you don't mind I am going to change the song to something I like. Report Comment Use this layout however you like! by *.·:¨𝘗𝘦𝘢𝘯𝘶𝘵¨:·.*; 1676575051; Report
mel 📸	1676048172 im using this i love it!! Report Comment Lookin good :D by *.·:¨𝘗𝘦𝘢𝘯𝘶𝘵¨:·.*; 1676055595; Report
K£nny	1676036410 Using Report Comment So cool! by *.·:¨𝘗𝘦𝘢𝘯𝘶𝘵¨:·.*; 1676055574; Report

Layout published by .·:*¨𝘗𝘦𝘢𝘯𝘶𝘵¨*:·.

Purple Space ✧･ﾟ: *✧･ﾟ:*

Description:

Preview:

Code:

Comments

Layout published by .·:¨𝘗𝘦𝘢𝘯𝘶𝘵¨:·.

Purple Space ✧･ﾟ: ✧･ﾟ: