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

Appl3	1774203349 Usingg Report Comment
mmmmmokay	1774106060 using!! Report Comment
naki	1774038497 usingg thank you so cute!! Report Comment
ezra	1773800370 usingg Report Comment
. ˖ ꒰𑁬 ♡ ໒꒱Zephyr꒰𑁬 ♡ ໒꒱ ˖ .	1773784292 using! Report Comment
SMV	1773579566 using :P Report Comment
🪽vye ˎˊ˗ ᵎ ᵎ	1773430239 usin Report Comment
Isa	1773204967 using!!! Report Comment
PINKCRYST4LZZZ	1773047946 usinggg Report Comment
théo	1772935687 using! Report Comment
sparkilysprinkles	1772728560 using! Report Comment
Rosie	1772558096 USING xD Report Comment
𝖆𝖓𝖎𝖒𝖊𝖌𝖍𝖔𝖚𝖑𝖊𝖒𝖔𝖗𝖞	1771729419 Using Report Comment
sprinkles	1771621526 UZ1NG!!! XDD Report Comment
x.angel3.x	1771029641 Using!! So cute!! ˃̶͈◡˂̶͈ Report Comment
WeirdOz_L0V3<3	1770348498 Using!!! Report Comment
Kateeboo	1770078364 Using x Report Comment
♡ Fifii ᓚᘏᗢ	1769678116 Using! ^_^ Report Comment
nammi-chan	1769524186 using! Report Comment
hollagrrll‧₊˚♪ 𝄞₊˚⊹‧₊˚♪ 𝄞₊˚⊹	1769394889 Using :) Report Comment