Welcome Home themed layout 🌈

Tags: multicolor, colorful, welcome home, kidcore
Description:

Welcome Home themed layout!! feel free to add or remove whatever you like <3
Preview:

click on the image for a larger preview
Code:

<!-- (c) Layout created by ☆⋆ VAMPYY !! (https://layouts.spacehey.com/layout?id=38239) -->

<style>

@font-face { font-family: 'Duck Spicy'; 
src: url(https://file.garden/ZLXU3yeVhBA68fNw/Duck_Spicy%5B1%5D.ttf); 
} span{ font-family: 'Duck Spicy'; text-align: center; }

@font-face { font-family: 'Coffee Extra'; 
src: url(https://file.garden/ZLXU3yeVhBA68fNw/Coffee_Extra%5B1%5D.ttf); 
} span{ font-family: 'Coffee Extra'; text-align: center; }


nav .top{
    background: white;
    border: 10px solid transparent;
    border-image: url(https://file.garden/ZCTlbRQZY2RSmYXG/deargodjr.png) 30 stretch;
    color: #2e1c15;
    margin-bottom: 5px;
}

nav .links{
    background: #1d33de;
    text-align: center;
    border-radius: 35px;
    margin-bottom: 5px;
}


nav .links a:hover {
    text-decoration: underline;
    color: #2e1c15;
    font-weight: bold;
    text-transform: uppercase;
}

a {
    font-family: 'Coffee Extra';
    text-decoration: none;
    font-style: italic;
    color: #2e1c15;
}

a:hover {
    animation: blinkingText 2s infinite;
    text-decoration: underline;
    font-size: 15px;
    text-shadow: 0 0 5px;
    font-style: bold;
}

@keyframes blinkingText {
15% {color: red; }
25% { color: orange; }
30% { color: yellow; }
35% { color: lightgreen; }
40% { color: green; }
45% { color lightblue; }
50% { color: blue; }
55% { color: darkblue; }
60% { color: darkpurple; }
65% { color: purple; }
70% { color: lightpurple; }
75% { color: pink; }
}

nav .links li:not(:last-child)::after, footer .links li:not(:last-child)::after {
    content: "✷";
    font-size: 20px;
    color: white;
}

.online{
    content: url(https://static.wixstatic.com/media/69154f_9f3dec116da5459e9f345a18b1252f3a~mv2.gif);
    width: 255px;
    height: auto;
    margin: auto;
}

main {
    border-radius: 5px;
    border: 10px solid transparent;
    padding: 15px;
    border-image: url(https://file.garden/ZCTlbRQZY2RSmYXG/deargodjr.png) 30 stretch;
    color: #2e1c15;
    background: url('...') no-repeat fixed; background-size: cover;
    font-size: 89%;
    background-color: white; }


body{
background: url(https://static.wixstatic.com/media/69154f_0f9c2943b6c642df8de393dabe2e85e6~mv2.png/v1/fill/w_262,h_3307,al_c,q_90,usm_0.66_1.00_0.01,enc_auto/69154f_0f9c2943b6c642df8de393dabe2e85e6~mv2.png)center center fixed;
font-family: 'Duck Spicy';
}

button {
    background: white;
    color: #2e1c15;
    border: 6px solid transparent;
    border-image: url(https://file.garden/ZCTlbRQZY2RSmYXG/deargodjr.png) 40 stretch;
    font-family: 'Coffee Extra';
    font-size: 12px;
}

button:hover {
    animation: blinkingText 2s infinite;
    text-decoration: underline;
    color: black;
}

input {
    background: transparent;
    border: 6px solid transparent;
    border-image: url(https://file.garden/ZCTlbRQZY2RSmYXG/deargodjr.png) 40 stretch;
    color: #2e1c15;
    font-family: 'Duck Spicy'; 
} 

main:before {
    height: 45px;
    display: block;
    content: "";
    background-image: url(https://static.wixstatic.com/media/69154f_22e74302994f486981da74c1a08ef394~mv2.png/v1/fill/w_1018,h_46,al_c,q_85,usm_0.66_1.00_0.01,enc_auto/Colorbar.png);
}

.profile{
        
    direction: rtl;
    
    }
.blurbs{
    
    direction: ltr;
        
    }
.blog-preview{
        
    direction: ltr;
        
    }
.friends{
    
    direction: ltr;
        
    }
.general-info{
        
    direction: ltr;
        
    }
.contact{
        
    direction: ltr;
    }
.url-info{
       
    direction: ltr;
        
    }
.details-table{
        
    direction: ltr;
        
    }
.profile .table-section .heading{
    
    direction: ltr;
        
    }
.details p{

    direction: ltr;
}

    main .right{
        width: 30%;
        border-radius: 5px;
    }
    main .left{
    }
.general-about .profile-pic img {
    max-width: 160px;
    max-height: 160px;
    border-radius: 70px;
}


DIV.blog-preview:before {
  content: "";
  display: block;
  height: 80px;
  width: 150px;
  background-image: url(https://static.wixstatic.com/media/69154f_a3220ef9c49e40c3a12d4370c4bdc86f~mv2.gif);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  align-content: center;
}

.general-about .profile-pic {
    display: block;
    margin: 0 15px 8px 0;
    height: 160px;
    text-align: center;
}

.general-about .details {
    display: block;
    text-align: center;
}

.profile .mood {
    width: 100%;
    display: inline-block;
    text-align: center;
    padding-top: 10px;
    ;
}

.general-about {
    display: grid;
    padding-top: 14px;
    padding-bottom: 14px;
    border: 9px solid transparent;
    border-image: url(https://file.garden/ZCTlbRQZY2RSmYXG/deargodjr.png) 30 stretch;
}

.profile h1{
background: -webkit-linear-gradient(orange, red);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
font-family: 'Coffee Extra';
font-size: 34px
}

.profile .blurbs .heading,
  .profile .friends .heading{
   background: url("https://cdn.discordapp.com/attachments/872309467956543531/1140045273591193640/IMG_4864.jpg");
   border-radius: 30px;
   color: #2e1c15;
   font-family: 'Coffee Extra';
   font-size: 20px;
   text-align: center;
}

.url-info{
    font-size: 0%;
    background: url(https://static.wixstatic.com/media/69154f_62964163e6df46bf88d52ac4417afa77~mv2.gif);
    background-position: center;
    height: 390px;
    background-size: cover;
    border: transparent!important;
}

.profile .contact .heading, .profile .table-section .heading, .setting-section .heading, .home-actions .heading {
    color: #2e1c15;
    background: url(https://cdn.discordapp.com/attachments/872309467956543531/1140045273591193640/IMG_4864.jpg);
    padding: 4px 7px;
    border-radius: 20px;
    font-family: 'Coffee Extra';
    font-size: 20px;
    text-align: center;
}

.profile .contact, .profile .url-info, .profile .table-section, .setting-section, .home-actions {
    width: 100%;
    border: none;
    margin: 10px 0;
}

.contact .inner {
    margin-top: 10px;
    background: transparent;
    border: 9px solid transparent;
    border-image: url(https://file.garden/ZCTlbRQZY2RSmYXG/deargodjr.png) 30 stretch;
}

.icon, .award img {
    display: inline-block;
    height: 1.4em;
    width: 1.4em;
    aspect-ratio: 1/1;
    margin: 0 0.05em 0 0.1em;
    vertical-align: -0.3em;
    font-size: 0;
}

.f-col:before {
    content: url(https://files.catbox.moe/ji93nz.gif);
}

table.details-table {
    width: 100%;
    border: 9px solid transparent;
    border-image: url(https://file.garden/ZCTlbRQZY2RSmYXG/deargodjr.png) 30 stretch;
    margin-top: 10px;
}

.details-table td:first-child {
background: -webkit-linear-gradient(orange, red);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
    font-weight: bold;
    font-family: 'Coffee Extra';
    font-size: 17px;
    width: 20%;
}

.details-table td {
    background: transparent;
    border: 2px solid orange;
    vertical-align: middle;
    border-radius: 2px;
}

footer {
    text-align: center;
    font-size: 70%;
    margin: 10px 0 10px;
    padding: 13px 50px;
    background: transparent;
    color: #2e1c15;
    font-family: 'Coffee Extra';
    font-size: 20px;
}

.profile .blurbs .heading, .profile .friends .heading {
    background: url(https://cdn.discordapp.com/attachments/872309467956543531/1140045273591193640/IMG_4864.jpg);
    color: #2e1c15;
    padding: 2px 7px;
    text-align: center;
    border-radius: 8px;
}

.profile .friends .inner {
    background: url(https://static.wixstatic.com/media/69154f_0f9c2943b6c642df8de393dabe2e85e6~mv2.png/v1/fill/w_262,h_3307,al_c,q_90,usm_0.66_1.00_0.01,enc_auto/69154f_0f9c2943b6c642df8de393dabe2e85e6~mv2.png);
    border: 9px solid transparent;
    border-image: url(https://file.garden/ZCTlbRQZY2RSmYXG/deargodjr.png) 30 stretch;
    margin-top: 13px;
    margin-bottom: 30px;
}

.profile .friends .person img:not(.icon) {
    max-width: 95px;
    max-height: 95px;
    display: block;
    margin: 0 auto;
    border-radius: 60px;
}

.profile .blurbs .inner {
    border-radius: 8px;
    margin-top: 13px;
    text-align: center;
}

.count {
    font-size: 25px;
    font-family: 'Coffee Extra';
    color: white;
}

.profile .blurbs .section h4 {
    margin: 0;
    background: -webkit-linear-gradient(orange, red);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
    font-family: 'Coffee Extra';
    text-align: center;
    font-size: 15px;
}

.profile .friends .person p {
    color: #2e1c15;
    font-weight: bold;
    width: 100%;
    overflow-wrap: break-word;
    word-break: break-word;
    font-size: 15px;
    font-family: 'Coffee Extra';
    text-align: center;
}

.comments-table td:first-child, .music-table td:first-child {
    background: white;
    text-align: center;
    font-weight: bold;
    width: 30%;
}

.comments-table td, .music-table td {
    background: transparent;
    vertical-align: top;
}

.comments-table td:first-child img:not(.icon) {
    width: 100px;
    max-width: 100%;
    max-height: 200px;
}

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

nav img.logo{
filter: brightness(0) saturate(100%) invert(20%) sepia(73%) saturate(7472%) hue-rotate(210deg) brightness(100%) contrast(100%); !important;
}

::-webkit-scrollbar {
    width: 12px;
    height: 6px;
    background: white;
}

::-webkit-scrollbar-thumb {
    background: lightgrey;
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background:  -webkit-linear-gradient(#de3b1b, orange, yellow, #1d33de);  
}

:root{ --neon-text-color: red; }
.profile .left h1{font-family: 'Coffee Extra', cursive; 
   font-size: 280%;
   transform: rotate(-4deg);
   font-family: "Coffee Extra";}

</style>


<img src="https://static.wixstatic.com/media/69154f_16b804b78da943a7abbf6779013763e0~mv2.gif" width="350px"/> Type out your “About Me” here! Hope you enjoy my layout &lt;3


<div style="float:  ; max-height: 650px; position: fixed; right: 459px; bottom: -5px; z-index: 200;"><img src="https://static.wixstatic.com/media/69154f_d5943c9eb84e424f8e20df0524fdeb5a~mv2.png/v1/fill/w_1049,h_437,al_c,q_90,usm_0.66_1.00_0.01,enc_auto/LargeBorder_file.png" width="850" height="400"/></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 1 of 1 comments ( View all | Add Comment )
claawkind
1702729056
i might just use this!
Report Comment