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

M i k ✿	1713881898 Using Report Comment
MOMO	1712793762 using Report Comment
✎︵‿‎ ‎ ‎ ✧.*Sammyੈ✩‧	1712629250 using! Report Comment
P1NK_CAT	1712621556 usiinggg Report Comment
Pingvinchek	1711562690 using! Report Comment
toasty :3	1711406506 using :3 Report Comment
mira:3	1711260928 using :3 (this layout is the color of my insides frfr) Report Comment
TheLittleLongNeck	1711178895 using it its so cute Report Comment
spiderlegs residence	1711053163 i'm using this Report Comment
Rachael	1710902133 This cute using it Report Comment
mora	1710705843 using :3 Report Comment
Androgynous_Enby	1710496055 using! Report Comment
☆Yiyi☆	1710459299 using! Report Comment
pixelatednightmare	1710298498 Using !! >< Report Comment
DEAD4RED :33	1710136487 usin !! :D Report Comment
cronk	1710098900 using!! Report Comment
Kayla*.	1710065849 Ysung Report Comment
judith	1709924137 using this. It's super cute:)<3 Report Comment
XyziiSP 🌠	1709909360 using!!! Report Comment
XyziiSP 🌠	1709909359 using!!! Report Comment