Blue Night Stars Layout

Tags: blue, stars

Description:

This is actually one of the layouts that I made for myself, but I decided to put it here in case anyone would like to use it and as a backup save

-Can be used as a base for your own layouts

-Credit me if you plan on using the layout as-is

-Comes with 7 weeks and 3 days by Yungatita (sped up/nightcore version)

Preview:

click on the image for a larger preview

Code:

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

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


<style>
@import url('https://fonts.googleapis.com/css2?family=Gideon+Roman&display=swap');


p{
  font-family: 'Gideon Roman', serif;
  font-size: 15px;
  color: white;
}

a{
  color:  #a2a1ff;
  text-shadow: 0px 0px 10px #ffc466;
}

a:hover{
  color: #ffc466;
  text-shadow: 0px 0px 10px #ffc466;
  font-style: italic;
}

body{
  background: url("https://i.pinimg.com/236x/ed/09/e5/ed09e59336777301126db16382dec660.jpg");
  background-size: 500px;
  background-position: 0px 0px;
  background-attachment: fixed;
}

main{
  background: transparent;
}

nav .top{
  border: double;
  border-bottom: none;
  border-radius: 5px 5px 0px 0px;
  box-shadow: 0px 0px 5px #ffc466;
  margin-right: 10px;
  margin-left: 10px;
  background: url("https://www.mmocentralforums.com/gallery/data/2584/glitter_background_blue_stars.gif");
}

.logo{
  content:url("https://files.catbox.moe/ukv6hf.png");
  display: block;
}

button, input{
  border: double #463d99;
  box-shadow: 0 0 10px #ffd591;
  color: black;
}
.top a{
  font-family: 'Gideon Roman', serif;
  font-size: 16px;
}

.top a:hover{
  color: #ffc466;
  text-shadow: 0px 0px 10px #ffc466;
  font-style: italic;
}

nav .links{
  border: double;
  box-shadow: 0px 0px 5px #ffc466;
  margin-right: 10px;
  margin-left: 10px;
  background: #1c2f63;
}

li.active .icon{ 
content:url("https://64.media.tumblr.com/bcd10e4e7492d911ccd08f28486cbf41/ba26780055d59e6c-2f/s75x75_c1/bc7dd9446a32539f091edb93d9b95c92c470cdfe.gifv"); 
  width: 20px;
  height: 20px;
}

nav .links li:not(:last-child)::after, footer .links li:not(:last-child)::after{
  content: " ✦ ";
  color: #ffc466;
}

nav .links a{
  font-family: 'Gideon Roman', serif;
  font-size: 13px;
  text-align: center;
}

nav .links a:hover{
  color: #ffc466;
  text-shadow: 0px 0px 10px #ffc466;
  font-style: italic;
}

.profile h1{
  color: white;
  text-shadow: 0 0 10px #ffd591;
  text-align: center;
  border: double;
  border-radius: 5px 5px 0px 0px;
  padding-top: 2px;
  padding-bottom: 2px;
  background: url("https://i.pinimg.com/originals/c9/08/1e/c9081e0010f4d7f7634d39eef3b61ee3.gif");
}

.general-about{
  border: double white;
  border-radius: 5px;
  box-shadow: 0px 0px 5px white;
  height: 320px;
  margin-bottom: 20px;
  background: #1e1e45;
}

.profile-pic{
  background: #e4d3f0;
  padding: 5px 5px 196px;
  transform: rotate(deg); 
  filter: grayscale(8%);
}

.award img{
  content: url("https://64.media.tumblr.com/668276dde494629ed888ad0f89dc5930/7e2130847fc1824a-4c/s75x75_c1/e8addcfe1e4476f1fc009f504d75d31cef311aa6.gifv");
  width: 25px; 
  height: 25px;
}

.award{
  position: relative;
  left: 8px;
}

.award a{
  font-size: 13px;
  color: #a2a1ff;
}

.award a:hover{
  color: #ffc466;
  text-shadow: 0px 0px 10px #ffc466;
}


.online{
  color: white;
  text-shadow: 0px 0px 8px #ffd591;
  position: relative;
  left: 8px;
}

.online img{
  content: url("https://64.media.tumblr.com/d7160538187895786877c430c35677cd/1b029f006b49240f-53/s75x75_c1/0edaa2ab1b8f9896a521936c7a1127b9ea1e59c2.gifv");
  animation-name: none;
}

.mood{
  border: double white;
  border-radius: 5px;
  box-shadow: 0px 0px 5px white;
  margin-bottom: 20px;
  background: #1e1e45;
}

.profile .mood p{
  padding-top: 4px;
  padding-left: 3px;
}

.profile .contact .heading, .profile .table-section .heading, .profile .blurbs .heading, .profile .friends .heading{
  color: white;
  text-shadow: 0 0 10px #ffd591;
  text-align: center;
  border: double white;
  border-radius: 5px 5px 0px 0px;
  box-shadow: 0px 0px 5px white;
  background: url("https://i.pinimg.com/originals/c9/08/1e/c9081e0010f4d7f7634d39eef3b61ee3.gif");
}

.profile .contact{
  border: double white;
  border-radius: 5px 5px 0px 0px;
  box-shadow: 0px 0px 5px white;
  background: #1e1e45;
}

.contact img.icon{ 
display: none; 
}

.contact{background-color:  !important;}

.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a::before{ 
 /* add to friends */
 content: " "; 
 display: inline-block; 
 width: 20px; 
 height: 20px; 
 background-image: url('https://64.media.tumblr.com/47dbdf1616d0630baa9a76b6edbb00f2/2c87988549a5302b-82/s75x75_c1/2d4a4e6fd48457cb848d89159ccb951d5a0e78c1.gifv'); 
 background-size: 100% 100%;
} 

.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a::before{ 
 /* add to favorites */
 content: " "; 
 display: inline-block; 
 width: 20px; 
 height: 20px; 
 background-image: url('https://64.media.tumblr.com/94e55beb47988b6aa2387de766c064ac/ca4465b320746059-40/s75x75_c1/a1c15f95d78947bfc0d2327d48b95dc93d6a5928.gifv'); 
 background-size: 100% 100%;
} 

.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before{ 
 /* send message */
 content: " "; 
 display: inline-block; 
 width: 20px; 
 height: 20px; 
 background-image: url('https://64.media.tumblr.com/c9a50c26550c1afaf767bc021f4dcafd/47a4384795cbfe1a-6a/s75x75_c1/c0964943c74543ac8c0f62a837d7234110a57e44.gifv'); 
 background-size: 100% 100%;
} 


.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before{
 /* forward to friend */
 content: " "; 
 display: inline-block; 
 width: 20px; 
 height: 20px;  
 background-image: url('https://64.media.tumblr.com/58a9ee9795938d8276d020d6850a16d1/1e9ba0e90a2a12e6-1f/s75x75_c1/ef35bf549950b8bd055e874026a745c024a268c5.gifv'); 
 background-size: 100% 100%;
} 

.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before{
    /* instant message */
 content: " "; 
 display: inline-block; 
 width: 20px; 
 height: 20px; 
 background-image: url('https://64.media.tumblr.com/55704d49bc70b05aafa0381317de3ab7/1e9ba0e90a2a12e6-d0/s75x75_c1/bb30d584b47fdf8e45fb6b050bc05c45dc9e3f1b.gifv'); 
 background-size: 100% 100%;
} 

.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
    /* block user */
 content: " "; 
 display: inline-block; 
 width: 20px; 
 height: 20px; 
 background-image: url('https://64.media.tumblr.com/285cbfe0bccc436e699d2fafb07fe088/a79b42d6e6497adf-99/s75x75_c1/3bd740a0b8860b49c1a897c1b31bd8967c60e3bb.gifv'); 
 background-size: 100% 100%;
} 

.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before{
    /* add to group */
 content: " "; 
 display: inline-block; 
 width: 20px; 
 height: 20px; 
 background-image: url('https://64.media.tumblr.com/499cf9c768906f02b076f86371c89c4c/e9d44ba4d75b39b9-04/s75x75_c1/4a4f9ae8305e668f4b9493a157dc252b4b8a62ac.gifv'); 
 background-size: 100% 100%;
} 

.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before{
    /* report user */
 content: " "; 
 display: inline-block; 
 width: 20px; 
 height: 20px; 
 background-image: url('https://64.media.tumblr.com/668276dde494629ed888ad0f89dc5930/7e2130847fc1824a-4c/s75x75_c1/e8addcfe1e4476f1fc009f504d75d31cef311aa6.gifv'); 
 background-size: 100% 100%;
} 

.profile .url-info{
  padding: 2px 7px;
  font-size: 0;
  border: double white;
  border-radius: 5px;
  box-shadow: 0px 0px 5px white;
  height: 430px;
  background: url("https://i.pinimg.com/236x/d8/67/f4/d867f4a31f22d3516f73957afd7b53ad.jpg");
  background-size: contain;
}

.profile-info{
  border: double white;
  border-radius: 5px;
  box-shadow: 0px 0px 5px white;
  background: url("https://i.pinimg.com/564x/9e/87/96/9e8796f95d04988701285a25f668bbe4.jpg");
  background-size: 500px;
  background-position: 0px 240px;
}

:root{
  --topic1: "General";
  --topic2: "Music";
  --topic3: "Anime, Manga & Comics";
  --topic4: "Games";
  --topic5: "Hyperfixations";
  --topic6: "Ppl I like";
 }

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

.details-table tr td:first-child p::after{
  color: white;
  letter-spacing: normal !important;
  text-shadow: none;
}

.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);
}

.table-section:not(.table-section + .table-section){
  border: double white;
  border-radius: 5px 5px 0px 0px;
  box-shadow: 0px 0px 5px white;
  background: url("https://i.pinimg.com/originals/c9/08/1e/c9081e0010f4d7f7634d39eef3b61ee3.gif");
}

.table-section + .table-section{
  border: solid black;
  background: url("https://i.pinimg.com/originals/c9/08/1e/c9081e0010f4d7f7634d39eef3b61ee3.gif");
}

table.details-table{
  border: none;
}

.details-table td:first-child, .comments-table td:first-child{
  background: url("https://www.mmocentralforums.com/gallery/data/2584/glitter_background_blue_stars.gif");
}

.details-table td, .comments-table td, .music-table td{
  background: url("https://i.pinimg.com/236x/1c/c2/f1/1cc2f19dd120595193a3f31c26e5cb9e.jpg");
}

.blog-preview h4{
  color: white;
  text-shadow: 0px 0px  10px #ffd591;
  text-align: center;
  position: relative;
  bottom: 17px;
  padding-top: 3px;
  padding-bottom: 3px;
  border: double white;
  border-radius: 5px 5px 0px 0px;
  background: url("https://i.pinimg.com/originals/c9/08/1e/c9081e0010f4d7f7634d39eef3b61ee3.gif");
}

.blog-preview{
  border: double white;
  border-radius: 5px 5px 0px 0px;
  box-shadow: 0px 0px 5px white;
  background: #1e1e45;
}

.blog-preview p{
  position: relative;
  bottom: 8px;
  padding-left: 7px;
  border-bottom: 3px dotted #ffbb3d;
}

.profile .blurbs .section h4{
  color: #ffc466;
  text-shadow: 0px 0px 10px #ffc466;

}

.blurbs{
  border: double white;
  border-radius: 5px 5px 0px 0px;
  box-shadow: 0px 0px 5px white;
  background: #1e1e45;
  height: 2442px;
  overflow-y: auto;
}

.profile .friends{
  border: double white;
  border-radius: 5px 5px 0px 0px;
  box-shadow: 0px 0px 5px white;
  margin-bottom: 20px;
  background: #1e1e45;
}

.profile .friends .person p{
  font-size: 15px;
  color:  #a2a1ff;
  text-shadow: 0px 0px 10px #ffc466;
}

.profile .friends .person p:hover{
  color: #ffc466;
  text-shadow: 0px 0px 5px #ffc466;
  font-style: italic;
}

table.comments-table{
  display: block;
  border: none;
  height: 920px!important;
  overflow-y: scroll;
}

.comments-table p{
  font-size: 13px;
}

table.comments-table td .icon{
  content: url("https://64.media.tumblr.com/c9a50c26550c1afaf767bc021f4dcafd/47a4384795cbfe1a-6a/s75x75_c1/c0964943c74543ac8c0f62a837d7234110a57e44.gifv");
  width: 25px;
  height: auto;
}

.count{
  color: #ffc466;
  text-shadow: 0px 0px 10px #ffc466;
}

footer{
  border: solid black;
  background: #1e1e45;
}

*{
  cursor: url(https://external-media.spacehey.net/media/sOyO4LJlieAah4BU3AOYb5SzDQ1nRqvCSOsA7LD0HX44=/https://64.media.tumblr.com/78fcf846c454c80fcfdfa3a2e9f8650a/tumblr_inline_p8c0ylqhHD1rhwzwl_75sq.gifv), url(https://external-media.spacehey.net/media/sOyO4LJlieAah4BU3AOYb5SzDQ1nRqvCSOsA7LD0HX44=/https://64.media.tumblr.com/78fcf846c454c80fcfdfa3a2e9f8650a/tumblr_inline_p8c0ylqhHD1rhwzwl_75sq.gifv), auto !important;
}

::-webkit-scrollbar {
    width: 15px;
    background: black;
}

::-webkit-scrollbar-thumb{
  border-radius: 3px;
  -webkit-box-shadow: inset 0 0 6px #470bd4;
  background-color: #9c8cff;
}

::-webkit-scrollbar-track{
  background: #070321;
}

html:before{
    content: " ";
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: linear-gradient(rgb(2 3 37 / 58%) 50%, rgb(0 0 0 / 0%) 50%);
    z-index: 2;
    background-size: 100% 2px, 3px 100%;
    pointer-events: none;
}
</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 20 of 209 comments ( View all | Add Comment )

Mollyay	1768474432 Using!! Report Comment
Brayan	1768349432 Using!! Report Comment
Brayan	1768348173 Using!! Report Comment
Ph🕷ebe	1768338381 using Report Comment
Moon	1766727689 using! Report Comment
Atlas's _forlien	1766340433 using! Report Comment
୨୧_lynnie_myra	1766295174 using Report Comment
୨୧_lynnie_myra	1766295168 using Report Comment
Sapphire ♤	1765979002 awesome Report Comment
Eli!( ꩜ ᯅ ꩜;)⁭ ⁭	1765650187 USing Report Comment
AlexHolyMoly	1765432948 Trying out ^^ Report Comment
kay	1765399592 using Report Comment
kaoru ฅ^>⩊<^ ฅ	1765234605 using !! Report Comment
Ms.Steal-your-lover	1765137279 using!!! Report Comment
claraofangels	1765118670 using Report Comment
auxxi ★	1764926063 hi! i wanna use this but it always puts a big gap after the 'who id like to meet' part :/ Report Comment You can fix it by changing the code :D in the blurbs section, you change the height to: auto, instead of the pixels that appear, i hope this helps by ★ Dex ★; 1766080740; Report You can fix it by changing the code :D in the blurbs section, you change the height to: auto, instead of the pixels that appear, i hope this helps by ★ Dex ★; 1766080740; Report
MC ⭑.ᐟ	1764753899 Using! :> (I hope you don't mind but I made a few changes) Report Comment
august :3	1764559538 using !! :33 Report Comment
Fox	1764456132 Using!!! Report Comment
Azieth Eazstar	1764173460 Using!! Report Comment