Pastel Layout (UPDATE)

Tags: pastel, cute

Description:

Pastel layout I did in my spare time, credit appreciated but not necessary. You can view the full layout on my page until I eventually make a new layout for my main UPDATE: Went back and updated a few things to make this layout better, enjoy!

Preview:

click on the image for a larger preview

Code:

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

<div class="melody"></div>
<div class="kuromi"></div>
<style>

/* Start https://www.cursors-4u.com */ * {cursor: url(https://cur.cursors-4u.net/nature/nat-10/nat991.cur), auto !important;} /* End https://www.cursors-4u.com */

    .kuromi {
        background: url(https://static.wikia.nocookie.net/hellokitty/images/8/8d/Sanrio_Characters_Kuromi_Image016.png/revision/latest?cb=20170404142717) no-repeat;
        background-size: 75%!important;
        position: fixed;
        left: 7px;
        bottom: -87px;
        height: 370px;
        width: 320px;
        z-index: 1000;
        opacity: 100%;
        pointer-events: none;
    }

    .melody {
        background: url(https://cdn.sanriowiki.com/3/38/My_Melody_happy.png) no-repeat;
        background-size: 107%!important;
        position: fixed;
        right: -30px;
        bottom: -50px;
        height: 370px;
        width: 320px;
        z-index: 1000;
        opacity: 100%;
        pointer-events: none;
    }

    .contact:after {
        width: 98%;
        height: 179px;
        display: block;
        content: "";
        background-color: transparent;
        background-image: url('https://i0.wp.com/38.media.tumblr.com/0d9dc0e014e173618adcf22fa8f47a9c/tumblr_neqyicWGSs1u1nuzeo1_500.gif');
        background-position: center;
        background-size: 240px;
        background-repeat: no-repeat;
    }
    
    nav .links li:not(:last-child)::after, footer .links li:not(:last-child)::after {
        content: " ★ ";
        color: white;
    }
    
    body {
        background-image: url(https://i.pinimg.com/originals/97/7a/ee/977aee5162b2c60ad8d109d8299435d9.gif);
        background-size: cover;
        background-attachment: fixed;
    }
    
    nav .top {
        background-image: url(https://data.whicdn.com/images/321706573/original.png);
        background-size: 380px;
        padding: 30px;
        background-position: center;
        border-radius: 30px;
        border-style: dashed;
        border-color: white;
        box-shadow: 0px 0px 10px;
    }  

    
    .profile {
        background-image: url('https://64.media.tumblr.com/c9cceb9c863a72f238bd1cb80deda477/tumblr_ozrjgdYG7i1uzwgsuo1_400.gifv');
        background-size: cover;
        background-attachment: fixed;
        border-radius: 20px;
        border-style: dashed;
        border-color: white;
        box-shadow: 0px 0px 13px;
    }
    
    main {
        background-color: transparent;
        color: white;
        text-shadow: 1px 1px 0px #ff70b0;
    }
    
    nav .links {
        background-color: transparent;
        text-shadow: 0px 0px 5px white; !important
    }
    
    .profile-pic {
        border-style: dashed;
        border-color: white;
        box-shadow: 0px 0px 10px;
        border-radius: 7px;
        overflow: hidden;
        animation-name: example;
        animation-iteration-count: infinite;
        animation-duration: 1.4s;

    }
    
    .profile .contact,
    .profile .url-info,
    .profile .table-section,
    .home-actions {
        border-color: white;
        border-style: dashed;
        border-radius: 6px;
        overflow: hidden;
        box-shadow: 0px 0px 5px;
    }
    
    table.details-table td {
        background-color: #ffbdd961!important;
        box-shadow: 0px 0px 3px white;
        border-radius: 6px;
    }
    
    .heading {
        margin-top: 3px;
        margin-bottom: 4px;
        background-color: transparent !important;
        color: white !important;
        border-bottom: 2px dashed;
    }
    
    .container {
        border-radius: 5px 5px 0 0;
        margin-top: 15px;
    }
    
    footer {
        border-radius: 5px;
        border-style: dashed;
        border-color: white;
        box-shadow: 0px 0px 10px white;
        background-image: url(https://data.whicdn.com/images/321706573/original.png);
        display: block !important;
    }
    
    table.comments-table td {
        background-color:  #ffbdd961!important;
        border-style: dashed;
        box-shadow: 0px 0px 10px;
        overflow: hidden;
        padding: 5px;
    }
    
    .comments-table td:first-child img {
        width: 80px;
        border-radius: 8px;
        border-style: dashed;
        border-color: white;
        overflow: hidden;
        box-shadow: 0px 0px 10px white;
        animation-name: example;
        animation-iteration-count: infinite;
        animation-duration: 1.4s;
    }
    
    .profile .friends .person img {
        border-radius: 8px;
        border-style: dashed;
        border-color: white;
        box-shadow: 0px 0px 10px white;
        animation-name: example;
        animation-iteration-count: infinite;
        animation-duration: 1.4s;
    }
    
    .blog-preview p {
        font-size: 1.3rem;
        background-color: #ffbdd961;
        border-style: dashed;
        box-shadow: 0px 0px 5px;
        padding: 10px;
    }
    
    .online {
        color: white;
        text-shadow: 1px 1px 0px #ff70b0;
        font-weight: bold;
        font-size: 95%;
    }
    
    .online img {
        content: url(https://thumbs.gfycat.com/ImpracticalWelcomeAndalusianhorse-size_restricted.gif);
        height: 2.5em;
        margin-right: 5px;
        animation-name: blink;
        animation-iteration-count: infinite;
        animation-duration: 2s;
    }
    
    .icon, .award img {
        content: url(https://gamingalamode.files.wordpress.com/2015/10/giphy.gif);
        display: inline-block;
        height: 2.0em;
        width: 2.0em;
        margin: 0 .05em 0 .1em;
        vertical-align: -0.3em;
        color: rgba(0,0,0,0);
    }
    
    .profile .blurbs .section h4 {
        margin: 0;
        color: #ff70b0;
        text-shadow: 1.3px 1.3px 0px white;
    }
    
    a {
        color: #ff70b0;
        text-shadow: 0px 0px 10px white; !important
        text-decoration: none;
    }
    
    a:hover {
        animation:blinkingText 1.2s infinite;
    }
    
    @keyframes blinkingText{
        0%{     color: #ff70b0;    }
        50%{    color: cyan; }
        100%{    color: #ff70b0; }
}
     
    .comments-table td:first-child {
        background-image: url('https://data.whicdn.com/images/321706573/original.png');
        background-size: 400px;
        background-position: absolute;
    }
    
    .count {
        color: #ff70b0;
        text-shadow: 1.3px 1.3px 0px white;
    }
    
    .details-table td:first-child {
        background: var(--even-lighter-blue);
        color: #ff70b0;
        text-shadow: 1.3px 1.3px 0px white;
        font-weight: bold;
        width: 33%;
    }

    .profile-info {
        background-image: url('https://data.whicdn.com/images/321706573/original.png');
        background-size: 600px;
        border: 2px solid white;
        box-shadow: 0px 0px 10px white;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 15px 5px;
        margin-bottom: 10px;
    }

    .profile .friends .person p {
        color: white;
        text-shadow: 1px 1px 0px #ff70b0;
        font-weight: bold;
        width: 100%;
        word-break: break-word;
        font-size: 100%;
        text-align: center;
    }
    
    @keyframes example {
0% {
transform:translate(0px,0.3px);
}
8% {
    transform:translate(0px,0.5px);
}

16% {
    transform:translate(0px,1px);
}

24% {
    transform:translate(0px,1.5px);
}

32% {
    transform:translate(0px,2px);
}

40% {
    transform:translate(0px,2.5px);
}

48% {
    transform:translate(0px,3px);
}

56% {
    transform:translate(0px,3.5px);
}

64% {
    transform:translate(0px,3px);
}

72% {
    transform:translate(0px,2.5px);
}

80% {
    transform:translate(0px,2px);
}

88% {
    transform:translate(0px,1.5px);
}

96% {
    transform:translate(0px,0.5px);
}

100% {
    transform:translate(0px,0.3px);
}


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

Kylie	1784442965 using Report Comment
Misty	1783916007 Using Report Comment
marihacikuri౨ৎkiyoteru and luka fan	1783676013 using Report Comment
Sammie (￣ω￣;)	1783477522 using Report Comment
Sammie (￣ω￣;)	1783477522 using Report Comment
☆ PopPawn ☆	1780803630 using :3 Report Comment
nana	1780417984 Using! Report Comment
nana	1780417980 Using! Report Comment
𝒩𝒾𝓀𝓈	1780330426 usinggg Report Comment
dani	1779215486 using Report Comment
daniii	1778521965 using Report Comment
polkaswirl	1778184378 Using !! :3 Report Comment
polkaswirl	1778184376 Using !! :3 Report Comment
sra	1777537065 the top part doesnt show and goes dark blue :( Report Comment
☆Lola.Lolipop⁠☆	1776691393 Using!! Report Comment
ꪮᩏꫝỉ	1775827371 using <3 Report Comment
angg44raki	1774899462 USing tyy Report Comment
Randosky33	1774832317 using thank you!! :)) Report Comment
Appl3	1774203349 Usingg Report Comment
mmmmmokay	1774106060 using!! Report Comment