Brown Layout

Tags: brown, simple, cute, layout, green

Description:

Brown layout , please comment if using !!

Preview:

click on the image for a larger preview

Code:

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

<style>
    body{
    background-color: #78694d !important;
    background-image: url('URL') !important;
    background-attachment: FIXED !important;
    background-repeat: NO-REPEAT !important;
    background-position: CENTER !important;
    background-size: COVER;}
</style>
    
<style>
    main{
    background-color: #af9570 !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>
   .top{
        border-radius: 25px 25px 25px 25px !important;}
        
    main{
        border-radius: 25px 25px 25px 25px !important;}
</style>
        
<style>
   .top{
    background-color: #9a815f !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;
    background-size: COVER;}
</style>
    
<style>
 .links{
     text-align:center;
    background-color: transparent !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>
    .top input{
    background-color: #a29673 !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>
    button{
    border-radius: 25px 25px 25px 25px !important;
    background-color: #a29673 !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>
    h1{
    text-align:center;
    background-color: transparent !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>
    .general-about{
    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;}
</style>

<style>
    .mood{
    text-align:center;
    background-color: transparent !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>
    .contact .heading{
    border-radius: 25px 25px 25px 25px !important;
    background-color: #664b32 !important;
    background-image: url('URL');
    background-repeat: repeat;
    background-position: center;}
</style>

<style>
    .contact{
    background-color: #51321f !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>
    .table-section .heading{
    border-radius: 25px 25px 25px 25px !important;
    text-align:center;
    background-color: black !important;
    background-image: url('URL');
    background-repeat: repeat;
    background-position: center;}
</style>

<style>
    table.details-table{
    background-color: #51321f !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: #af9570 !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>
    .blog-preview h4{
    border-radius: 25px 25px 25px 25px !important;
    background-color: COLOR;
    background-image: url('URL');
    background-repeat: repeat;
    background-position: center;}
</style>

<style>
    .blog-preview{
    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;}
</style>

<style>
    .blurbs .heading{
    border-radius: 25px 25px 25px 25px !important;
    background-color: #664b32 !important;
    background-image: url('URL');
    background-repeat: repeat;
    background-position: center;}
</style>

<style>
    .blurbs{
    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;}

<style>
    .friends .heading{
    border-radius: 25px 25px 25px 25px !important;
    background-color: #664b32 !important;
    background-image: url('URL');
    background-repeat: repeat;
    background-position: center;}
</style>

<style>
    .friends{
    background-color: #78694d !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>
    .comments-table td{
    background-color: #9a815f !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;
    border-radius: 25px 25px 25px 25px !important;}
</style>

<style>
table.comments-table{
display: block;
height: 250px!important;
overflow-y: scroll;}
</style>

<style>
    ::-webkit-scrollbar {
    width: 5px;
    height: 10px;}

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

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

<style>
you can change it at https://codepen.io/sosuke/pen/Pjoqqp */
nav img.logo{
    filter: brightness(0) saturate(100%) invert(84%) sepia(12%) saturate(11%) hue-rotate(330deg) brightness(79%) contrast(89%);!important;
}
</style>

<style>
    .logo{
    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;}
</style>

<style>
    footer{
    background-color: transparent !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>
    .top{
    color: #3d2a1b;}    
    
    main{
    color: #3d2a1b !important;}
    
    footer{
    color: transparent;}
</style>

<style>
    a{
    color: #3d2a1b !important;}
    
    a:hover{
    color: #3d2a1b !important;}
    
    a:visited{
    color: #3d2a1b !important;}
    
    .top a{
    color: #3d2a1b !important;}
    
    .top a:hover{
    color: #3d2a1b !important;}
    
    .top a:visited{
    color: #3d2a1b !important;}
    
    .links a{
    color: #3d2a1b !important;}
    
    .links a:hover{
    color: #3d2a1b !important;}
    
    .links a:visited{
    color: #3d2a1b !important;}
   
    .friends-grid p{
    color: #3d2a1b !important;}

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

<style>
table, th, td {
  border: 0px trans;text-align:center;border-radius: 15px;}

:root {
  --topic1: "˗ˏˋ General ˎˊ˗";
  --topic2: "˗ˏˋ Music ˎˊ˗";
  --topic3: "˗ˏˋ Movies ˎˊ˗";
  --topic4: "˗ˏˋ Shows ˎˊ˗";
  --topic5: "˗ˏˋ Books ˎˊ˗";
  --topic6: "˗ˏˋ Heroes ˎˊ˗";}

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

.details-table tr td:first-child p::after{
color:var(--links) !important;
letter-spacing:normal !important;
text-shadow: 2px 2px black !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>
    .profile .friends .inner, .profile .blurbs .section h4{
    text-align: center;
    }
</style>

<style>
a:hover {    
 cursor: url('http://www.rw-designer.com/cursor-view/169382.png'), auto;
}
* {
 cursor: url('http://www.rw-designer.com/cursor-view/169437.png'), auto;
}
</style>

<style>
.profile .friends .person img:not(.icon) {
border-radius:15px;
box-shadow: 1px 0px 7px 2px rgba(154,129,95);
}
</style>

<style>
.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>
    .profile-pic img{
border-radius:25px;}
</style>

<style>

.contact .heading{ font-size:0; text-align:center; }
.contact .heading:before{ content: "contacting me"; font-size:.8rem; font-weight:bold; }

.blog-preview h4{ font-size:0; text-align:center;}
.blog-preview h4 a{font-size:.8rem;margin-left:5px; }
.blog-preview h4:before{ content: "Blog Enteries"; font-size:.8rem; }

.blurbs .heading{ font-size:0; text-align:center;}
.blurbs .heading:before{ content: "My Blurbs"; font-size:.8rem; font-weight:bold; }

.friends .heading{ font-size:0; text-align:center;}
.friends .heading:before{ content: "Friends Space"; font-size:.8rem; font-weight:bold; }

.friends#comments .heading{ font-size:0; text-align:center; }
.friends#comments .heading:before{ content: "Friends Comments"; font-size:.8rem; font-weight:bold; }
</style>

<style>
     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{
border: 1px transparent !important;
border-radius: 15px;}
</style>

<style>
body  
    {
--lighter-blue: none;
}

:root{
  --dark-orange: #78694d;
}

.online{content:url("https://www.myspacegens.com/images/online_now/309.gif");}

</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 108 comments ( View all | Add Comment )

Kody	1749242774 using !! Report Comment
nyxx	1748921016 using! Report Comment
anto 𓇼	1748915620 usingg Report Comment
lizzy	1748130130 Usingggg Report Comment
xDESTROYx	1747363707 using maybeee if it works ig :p Report Comment
xDESTROYx	1747363707 using maybeee if it works ig :p Report Comment
xDESTROYx	1747363707 using maybeee if it works ig :p Report Comment
xDESTROYx	1747363706 using maybeee if it works ig :p Report Comment
xDESTROYx	1747363706 using maybeee if it works ig :p Report Comment
xDESTROYx	1747363706 using maybeee if it works ig :p Report Comment
xDESTROYx	1747363706 using maybeee if it works ig :p Report Comment
xDESTROYx	1747363706 using maybeee if it works ig :p Report Comment
xDESTROYx	1747363704 using maybeee if it works ig :p Report Comment
xDESTROYx	1747363702 using maybeee if it works ig :p Report Comment
‧₊˚ ☁️⋅♡𓂃 ࣪ ִֶָ☾.Jay⋆⑅˚₊	1746672394 using!!! Report Comment
Kksblog	1746220836 Using Report Comment
Gliese Sylveon	1742436396 USING!!! It’s so cute ^0^ Report Comment
greycie ദ്ദി(｡•̀ ,<)~✩‧₊	1741549958 using ^^ Report Comment
Yuriyuri	1741470955 using! Report Comment
gigi	1741046079 Using ^_^ Report Comment