john/june egbert themed layout

Tags: john egbert, june egbert, blue, homestuck

Description:

no need for credit just dont claim as ur own feel free to edit or take out whatevr u want https://media.discordapp.net/attachments/995350972077441107/1062871491202514974/image.png?width=196&height=363

Preview:

click on the image for a larger preview

Code:

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

<style> @import url('https://fonts.googleapis.com/css2?family=Righteous&family=VT323&display=swap'); 
p{
  font-family: 'Righteous', cursive;
  font-size: 15px;
}
body{
    background-image: url(https://th.bing.com/th/id/R.d5de630f8da12cc49e059dff7c4071e7?rik=QLvrZKvw6u0ylw&riu=http%3a%2f%2fcliparts.co%2fcliparts%2frcj%2fRx5%2frcjRx5AXi.png&ehk=Sde7aASAfkf%2bQYMr%2bGhvEnUIGV%2fldo12v%2fng6OOo1OU%3d&risl=&pid=ImgRaw&r=0);
}
h1{
    background-color: #0982fb;
    text-align: center;
    color:white;
    font-family: 'Righteous';
    border-radius: 5px;
    box-shadow: 0px 0px 5px 5px #564dff;
    border: 3px solid white;
}
h2,h3,h4,h5{
    font-family: 'Righteous', cursive;
    font-size: 20px;
}
main .left{
    background-color:#0b19b1;
    border-radius:5px;
    border:3px solid white;
}
main .right{
    background-image: url(https://i.pinimg.com/564x/5e/22/76/5e2276f80ea4d8c98ebe68903b290f08.jpg);
    border-radius: 5px;
    border: 3px solid white;
}
DIV.url-info{
    color:#0b19b1;
    background-image:url(https://magma.com/shared/fwGG-KHtqstjvwNq1_trlA);
    text-shadow: 1px 1px 2px#ffffff, 0 0 25px#ffffff, 0 0 3px#ffffff;
}
main:before {
        width: auto;
        border: 5px solid white;
        height:326px;
        display:block;
        content: " ";
        background-image: url(https://magma.com/shared/4_nFGGO_Ej0sH5MWmvzkGQ);
        border-radius: 5px;
    }
DIV.profile-pic > IMG{
    border-radius:100px;
    border: 3px solid white;
    box-shadow: 0px 0px 5px 5px #564dff;
    
}
DIV.details > P{
    color:white;
    font-family:'Righteous';
    font-size:10px;
}
LI:nth-child(6) > A > IMG.icon{
    content:url(https://th.bing.com/th/id/R.9accc1c2cbea5e2c7c8f6dc9a1363b1c?rik=fR985wASbBxI8w&riu=http%3a%2f%2ffc06.deviantart.net%2ffs71%2ff%2f2011%2f283%2f9%2f0%2fgreen_slime_ghost_by_taorero-d4cgqe1.png&ehk=c3YchCIh0bsqzhJip6oGtUD%2foWwU5ceGmX88PNmq40M%3d&risl=&pid=ImgRaw&r=0);
}
DIV.blog-preview{
    background-image: url(https://66.media.tumblr.com/tumblr_lyfpx4KjL01qfscqb.gif);
    border:3px solid white;
    box-shadow: 0px 0px 5px 5px #564dff;
    border-radius: 5px;
    color:white;
    text-shadow: 1px 1px 2px #564dff, 0 0 25px#564dff, 0 0 3px #564dff;
}
footer {
    background-image: url(https://th.bing.com/th/id/R.a53dff3aee35b64bcef50a8efa48f56b?rik=VKbHmeIS3LdxVg&riu=http%3a%2f%2fimages5.fanpop.com%2fimage%2fphotos%2f25800000%2fJohn-homestuck-25853150-650-450.gif&ehk=W5SagMO8lc1hhO7KjEbvVBrGMoLYyS9Z7PDb%2b8Vi8Ig%3d&risl=&pid=ImgRaw&r=0);
    border-radius: 5px;
    box-shadow: 0px 0px 5px 5px white;
}
DIV.mood {
    color:white;
    
}
.general-about {
    border: 3px solid white;
    border-radius: 5px;
    text-align: center;
    padding: 40px;
    animation: nineties2 2s ease 0s infinite normal none;
    animation-delay: .46s;
    text-align: center;
color: #00bfff;
    background-image: url(https://i.pinimg.com/564x/74/21/a5/7421a5035c60ad4d75d80329b5f0eba5.jpg);
background-size: 500px;
box-shadow: 0px 0px 5px 5px #564dff;
}
:root{
    --logo-blue:#002f94;
    --darker-blue:#00bfff ;
    --lighter-blue: #0982fb;
    --even-lighter-blue:#00bfff;
    --lightest-blue:#0982fb;
    --dark-orange:#00bfff;
    --light-orange:#0023cc;
    --even-lighter-orange:#00bfff;
    --green:;
}
DIV.friends:nth-child(3) > DIV.heading{
    text-align: center;
    border:3px solid white;
    border-radius:5px;
    box-shadow: 0px 0px 5px 5px #564dff;
}
DIV[id='comments'].friends > DIV.heading{
    text-align: center;
    border:3px solid white;
    border-radius:5px;
    box-shadow: 0px 0px 5px 5px #564dff;
}
DIV.blurbs > DIV.heading{
     text-align: center;
    border:3px solid white;
    border-radius:5px;
    box-shadow: 0px 0px 5px 5px #564dff;
}
H4 > A{
    color:white;
}
DIV.blurbs > DIV.inner{
    text-align: center;
    text-shadow: 1px 1px 2px #001680, 0 0 25px#ffffff, 0 0 3px #ffffff ;
    background-color:#0023cc;
    border: 3px solid white;
    color:white;
    box-shadow: 0px 5px 5px 5px #564dff;
}
DIV.table-section:nth-child(6) > DIV.inner > TABLE.details-table{
    background-color:#003eff;
    color:white;
    text-shadow: 1px 1px 2px #564dff, 0 0 25px #564dff, 0 0 3px #564dff;
    border: 1px solid;
}
DIV.table-section:nth-child(6){
    border: 3px solid white;
}
DIV.contact > DIV.inner{
    border:3px solid white;
}
DIV.table-section:nth-child(7){
    border:3px solid white;
}
div.friends:nth-of-type(3) > div.inner:nth-child(2) > p:first-child > b:first-child{
    color:#001e7a;
    text-shadow: 1px 1px 2px #564dff, 0 0 25px #ffffff, 0 0 3px #ffffff;
}
/* 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: url(https://magma.com/shared/sWFjvzWoeD8Rr-DG33N_xg)
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
/* add to favorite */
content: url(https://magma.com/shared/sWFjvzWoeD8Rr-DG33N_xg)
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
/* send a message */
content: url(https://magma.com/shared/odVjvza1e2XOVnSBx7xUbA)
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
/* foward to friend*/
content: url(https://magma.com/shared/odVjvza1e2XOVnSBx7xUbA)
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
/* instant message */
content: url(https://magma.com/shared/hhL67QLIhWO_OIo8z4QcEA)
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
/* block user */
content: url(https://magma.com/shared/hhL67QLIhWO_OIo8z4QcEA)
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
/* add 2 group  */
content: url(https://magma.com/shared/ndHerQazY784-aSTT3DpKw)
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
/* report */
content: url(https://magma.com/shared/ndHerQazY784-aSTT3DpKw)
}   
.online{
    content:url();
}
DIV.person:nth-child(1) > A:nth-child(2) > IMG{
    border-radius:100px;
}
DIV.person:nth-child(2) > A:nth-child(2) > IMG{
    border-radius:100px;
}
DIV.person:nth-child(3) > A:nth-child(2) > IMG{
    border-radius:100px;
}
DIV.person:nth-child(4) > A:nth-child(2) > IMG{
    border-radius:100px;
}
DIV.person:nth-child(5) > A:nth-child(2) > IMG{
    border-radius:100px;
}
DIV.person:nth-child(6) > A:nth-child(2) > IMG{
    border-radius:100px;
}
DIV.person:nth-child(7) > A:nth-child(2) > IMG{
    border-radius:100px;
}
DIV.person:nth-child(8) > A:nth-child(2) > IMG{
    border-radius:100px;
}
#comments > div.inner:nth-child(2) > p:first-child > b:first-child{
    color:#001e7a;
      text-shadow: 1px 1px 2px #564dff, 0 0 25px #ffffff, 0 0 3px #ffffff;
}
table.comments-table > tbody:first-child > tr:first-child > td:first-child{
    border:5px solid white;
}
table.comments-table > tbody:first-child > tr:nth-child(2) > td:first-child{
    border:5px solid white;
}
tr:nth-of-type(1) > td:nth-child(2) > p.report:nth-child(4) > a:first-child{
    color:white;
}
NAV > UL.links{
font-family:'Righteous';
}
</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 4 of 4 comments ( View all | Add Comment )

riker lalonde 🍷	1698288953 using! Report Comment
Scratch21	1675286720 oof this is amazing Report Comment will you ever do nepeta? or any other chars ^-^ by Scratch21; 1675286787; Report Yes ill do more homestuck characters in the future like nepeta and such im still working on my rose lalonde one by khsdu2; 1675898389; Report
doctorjaltoid	1673740724 REAL Report Comment
xxjaydem0nxx	1673545705 DIS IZ SO KEWL OHMYGAWDDD Report Comment THANK YEW SM!! by khsdu2; 1673547794; Report