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

Feli 𐔌˙.	1788116130 using! Report Comment
whales400	1787039891 using! Report Comment
cal☆	1786555779 using! Report Comment
livelaughlove	1784595028 using, thanks Report Comment
j ☮︎	1784274351 using Report Comment
nana	1783427720 usinng,tyy Report Comment
rinphobiccc	1782698177 ussingg !! Report Comment
aco !!	1780047546 usingggg Report Comment
K3NI	1774622050 using :) Report Comment
lina ⋅ᯓᡣ𐭩	1774304276 using Report Comment
⭒ Yuri ˳ ੭ ֪ 。	1773932191 Using —★ Report Comment
𝒵𝑜𝓂𝒷𝒾𝑒.ᐟ	1773027702 using :P Report Comment
Zylerith	1772801776 using!! Report Comment
MVRA!!	1772724496 Using ( tysm )! Report Comment
cassandra	1769616400 Using Report Comment
Otis	1767055304 Using Report Comment
maple	1766209725 using this is fire! Report Comment
jae	1762758439 usingg tysm! Report Comment
jack4kline	1762471570 using!! :D Report Comment
Ezzie	1762145896 using Report Comment