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

Go0B3r	1752461259 hi hi! using this! But can you tell me which thing to remove to get rid of cinnamoroll? Thx!!! Report Comment
Rachel	1752456589 Using the layout thank you Report Comment
ari	1752384297 USING!@ Report Comment
Gy4ru_4_Lif3u	1752322507 Thanks mat3, USIIIIIING Report Comment
HEE HEE	1752081804 using Report Comment
V	1752001189 usinggg Report Comment
philia	1751845927 using! Report Comment
~•°sk8r_gurll°•~	1751212599 Using Report Comment
Franz	1750791620 using Report Comment
N3ON_ST4RZ	1750712800 Using!!!! :3 Report Comment
just a therian girly!	1750700983 usinggggggggggggggggggggggggggggggggg Report Comment
Moonlight-fizz	1750452384 using Report Comment
Cass / Vani	1750309656 Using!! <3 Report Comment
ebtrollfan	1750059906 so cute! will be using the layout!! Report Comment
pinkI	1750024298 using!!! so cute!! Report Comment
juniper	1749741026 THIS IS SOOO CUTE Report Comment
Z.P < 3	1749489379 So cute! Usingg Report Comment
goldie	1749429121 using~~ Report Comment
☆-「♪Xenopup♪」-☆	1749223084 Using ^^ Report Comment
nigel ˶ᵔ ᵕ ᵔ˶	1749015726 using! Report Comment