Pastel Anime Layout

Tags: anime, pink, blue, cute, pastel, animation, animecore

Description:

this is my first layout so idk if i did it correctly but i hope i did,

the code is a bit of a mess cause im not good at organizing code but it should work !!

if u need any help feel free to message me !

Preview:

click on the image for a larger preview

Code:

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

<div class="ena"></div>
<div class="moon"></div>

<style>
.container {
    width: 850px;
    max-width: 100%;
    margin: 0 auto 10px;
}
.online{
    content: url(https://media.discordapp.net/attachments/767899865090883594/867133378808250438/tumblr_2a80af11cc46410566a84bdc17cc7b08_0f39cad7_1280.gif?width=100&height=50);
}
a {
    color: #5ecfe4;
    text-decoration: none;
    text-shadow: 1px 1px white;
}
.general-about .profile-pic img {
    max-width: 160px;
    max-height: 160px;
    border-radius: 30px;
    border: solid #f9b5c9;
}
.profile .blurbs .section h4 {
    margin: 0;
    color: #c36262;
}
body {
    background: url(https://i.pinimg.com/originals/b3/d9/06/b3d906b0ef4532ff48576fe7fd1f47e2.gif);
    background-size: cover;
    background-attachment: fixed;
    font-family: 'VT323', monospace;
    background-position: center;
    text-transform: lowercase;
    image-rendering: pixelated;
    background-color: #000000;
    font-size: larger;
}
nav .top {
    background: #53263900;
    padding: 15px 10px 14px 10px;
    display: flex;
    color: black !important;
}
nav .links {
    background-color: #53263900;
    padding: 3.5px 16px 5.5px 16px;
    text-align: center;
    color: black !important;
}
nav .links a {
    text-decoration: none;
    color: black;
    font-size: 0.98em;
}
nav .top .left .logo {
    width: 165px;
    height: 42px;
    -webkit-filter: brightness(15%);
}
.profile .friends .person img:not(.icon) {
    max-width: 95px;
    max-height: 95px;
    display: block;
    border-radius: 15px;
    margin: 0 auto;
    border: solid #f9b5c9;
}
.mood:after {
    content: "" url(https://media.discordapp.net/attachments/767899865090883594/914316831454547989/35635694_qMdduv6MK48IZWD.gif)
}
.profile .blurbs .heading, .profile .friends .heading {
    background: #ffb7c9;
    color: rgb(255 255 255 / 90%);
    padding: 2px 7px;
    border-radius: 40px;
}
.profile .friends .person {
    width: 105px;
    display: inline-block;
    padding: 5px;
    margin: 0 3px 10px 3px;
}
.profile .contact, .profile .url-info, .profile .table-section, .home-actions {
    width: 100%;
    border: 2px solid #ffb7c9;
    margin: 10px 0;
    border-radius: 0px 20px;
}
.profile .contact .heading, .profile .table-section .heading, .home-actions .heading {
    background: #ffb7c9;
    color: white;
    padding: 2px 7px;
    border-radius: 0px 15px;
}
.details-table td:first-child {
    background: #ffdbdb00;
    color: #290973;
    font-weight: bold;
    width: 33%;
}
.details-table td {
    background: #ffdbdb;
    vertical-align: top;
}
.profile .contact, .profile .url-info, .profile .table-section, .home-actions {
    width: 100%;
    border: 2px solid #ffb7c9;
    margin: 10px 0;
}
main, footer {
    background: #ffffffe6;
    color: black;
    padding: 6px 6px;
    font-size: 75%;
    border-radius: 20px;
    border: solid #ffb8b8 6px;
    /* box-shadow: #ffffff 0 0 18px; */
}
.table-section:not(:last-child) .details-table tr td:first-child p {
    color: transparent !important;
    text-shadow: none !important;
    letter-spacing: -100px;
}
.table-section:not(:last-child) .details-table tr:nth-child(1) td:first-child p::after {
    content: "general";
}
.table-section:not(:last-child) .details-table tr:nth-child(2) td:first-child p::after {
    content: "musics";
}
.table-section:not(:last-child) .details-table tr:nth-child(3) td:first-child p::after {
    content: "movies";
}
.table-section:not(:last-child) .details-table tr:nth-child(4) td:first-child p::after {
    content: "tv";
}
.table-section:not(:last-child) .details-table tr:nth-child(5) td:first-child p::after {
    content: "books";
}
.table-section:not(:last-child) .details-table tr:nth-child(6) td:first-child p::after {
    content: "games";
}
.table-section:not(:last-child) .details-table tr:nth-child(7) td:first-child p::after {
    content: "music box";
}
.table-section:not(:last-child) .details-table tr:nth-child(8) td:first-child p::after {
    content: "random";
}
.details-table tr td:first-child p:after {
    color: #730909;
    !important: ;
    letter-spacing: normal !important;
    filter: brightness(100%) !important;
}
main .left, main .right {
    padding: 10px;
}
@keyframes float { 
0% { transform: translate(0, 0px);
}
50% {
transform: translate(0, 10px);
}
</style>

<style>
.comments-table td, .music-table td {
    background: #ffdbdb;
    vertical-align: top;
}
.comments-table td:first-child, .music-table td:first-child {
    background: #ffdbdbbd;
    text-align: center;
    font-weight: bold;
    width: 38%;
}
.profile-info {
    border: 5px outset;
    display: flex;
    background: #f98ca2;
    align-items: center;
    justify-content: center;
    padding: 15px 5px;
    margin-bottom: 10px;
    background-size: 100% 100%;
    opacity: 80%;
}
.ena {
    background: url(https://i.ibb.co/gvTbhht/ena-throwup-copy.gif) no-repeat;
    background-size: 100%!important;
    position: fixed;
    left: -65px;
    bottom: 0px;
    height: 180px;
    width: 312px;
    z-index: 1000;
    opacity: 90%;
}
.col.w-40.left:after {
    content: "";
    background-image: url(https://i.imgur.com/B6alyIi.gif);
    height: 28%;
    width: 17.15%;
    border-radius: 0px 40px;
    overflow: hidden;
    position: absolute;
    background-size: 100% 100%;
    opacity: 90%;
    border: solid #f9b5c9;
}
.general-about:before {
    background-image: url(https://media.discordapp.net/attachments/783779926062268478/860684132564336650/laincd.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    display: block;
    height: 100px;
    width: 100px;
    content: " ";
    transform: rotate(
315deg
) scale(1.7) translateX(1.4em) translateY(-5.7em);
    position: absolute;
    z-index: -1;
}
.profile h1 {
    font-size: 1.7em;
    margin: 0 0 10px 0;
    -webkit-text-stroke: black 1.1px;
    text-align: center;
    color: white;
    font-family: 'Sniglet', cursive;
}
.profile .left h1:before {
    background-image: url(https://media.discordapp.net/attachments/767899865090883594/914316831240642580/35152752_vBDTSU0GY0Kp2TW.gif);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    display: block;
    height: 100px;
    width: 100px;
    content: " ";
    transform: rotate(316deg) scale(2.7) translateX(-4.9em) translateY(2em);
    position: absolute;
    z-index: -1;
}
</style>

<style>
.count {
    color: #b50101;
}
.comments-table {
    height: 700px;
    display: block;
    overflow-y: scroll;
}
h2 {
    margin: unset;
    font-weight: 100;
    font-size: large;
}
iframe {
    border-radius: 0px 35px !important;
    opacity: 95%;
    border: solid #f9b5c9;
}
@keyframes hue-rotate {
0% {
    filter: saturate(1.7) sepia(0.2) hue-rotate(0deg);
}
100% {
    filter: saturate(1.7) sepia(0.2) hue-rotate(360deg);
}
}
.url-info {
    background: url(http://svenge.evamonkey.com/evasite/titlecards/eoelogo.png);
    background-position: center;
    background-size: cover;
    height: 180px;
    text-shadow: none;
    color: #ceece5;
    text-align: center;
}
.moon {
    background: url(https://media.discordapp.net/attachments/767899865090883594/914316831047692348/36320485_zMQxytdIMdgvbrz.png) no-repeat;
    background-size: 100%!important;
    position: fixed;
    right: -1px;
    bottom: 0px;
    height: 205px;
    width: 160px;
    z-index: 1000;
    opacity: 90%;
}
.profile-pic:before {
    background-image: url(https://media.discordapp.net/attachments/767899865090883594/914316830724743188/35311526_3lxaV5ypAZUQw6n.gif);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    display: block;
    height: 100px;
    width: 100px;
    content: " ";
    transform: rotate(0deg) scale(2.5) translateX(-3em) translateY(20em);
    position: absolute;
    z-index: -1;
}
.comments-table td:first-child img:not(.icon), .bulletin-table td:first-child img:not(.icon) {
    border-radius: 15px;
    margin: 0 auto;
    border: solid #f9b5c9;
}
</style>

<style>
@import url('https://fonts.googleapis.com/css2?family=Nanum+Gothic+Coding&display=swap');
</style>

<style>
@import url('https://fonts.googleapis.com/css2?family=Sniglet:wght@800&display=swap');
</style>

<style>
@import url('https://fonts.googleapis.com/css2?family=VT323&display=swap');
</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 20 comments ( View all | Add Comment )

yakko >-<	1699052709 using :3 :3 :3!! Report Comment
michelle! !	1684192301 so cute! ! gonna use X) Report Comment
dazey <3	1684039214 so cute using :} Report Comment i c u randal pfp ehe by DORK☆; 1699761798; Report
ghostyTrickster	1681352505 can someone link the code or url for the online transgender flag icon? ^_^ Report Comment here u go :3 .online{ content: url(https://media.discordapp.net/attachments/767899865090883594/867133378808250438/tumblr_2a80af11cc46410566a84bdc17cc7b08_0f39cad7_1280.gif?width=100&height=50); } by vomitgirl; 1681423821; Report
Gₕₒₛₜ✪ₗₑₐf	1680827174 Using Report Comment
Mary <3	1678312977 using!! Report Comment
˚ʚ♡ɞ˚My Diary˚ʚ♡ɞ˚	1668191507 using !! Report Comment
Amber Whitfield	1660176380 love this, going to use it. Report Comment
★ᵃʳᶜʰⁱᵛᵉⁱⁿᵗᵉʳⁿᵉᵗᵉˣˣᵖˡᵒʳᵉʳ1300ᶻᶻ★	1659953128 Hii luv this layout sm! Is there a way to just get the nge url code thing? I hope that makes sense ^^* Report Comment yes, just scroll down to the url-info code (its near the bottom of the code) and copy that into ur page with the rest of ur code and it should work ! by vomitgirl; 1660000772; Report
lunar <3	1656475617 can i use this as a base? Report Comment sure ! by vomitgirl; 1656517656; Report thanks by lunar <3; 1656544811; Report
Ang!	1653699769 I love this!! gonna use!! Report Comment
Elijah	1652457542 This layout is so cute mind if i use? Report Comment no not at all ! i posted it on here to be used :33 by vomitgirl; 1652488122; Report
Josu	1636830169 This layout is so nice, is there a way to just get the ENA image from the bottom left as a separate piece of code or is it built in to the background? Report Comment There is!! you simply have to start it with and then scroll down in the code and use the block that starts with .ena !! By messing around with the image url and parameters u can use any image and move it wherever you like! by Meat; 1636953777; Report Whoops! It cut out part of my comment because it looked too much like code, hahaha. It’s the part at the beginning that says div class “ena” , copy+paste that line and the block I mentioned and you should b good to go! by Meat; 1636953976; Report Thank you! I'll look for it right away :3 I love Ena lol, would love for her to be on my page by Josu; 1636954037; Report No problem!!! Good luck :D by Meat*; 1636954299; Report
Kasia Sledge	1636689654 I love this layout, i just wish it didnt have the teans flag bc i dont want to put something im not ️ Report Comment trans* i meant by Kasia Sledge; 1636689694; Report oh if u put it on ur profile and just remove the .online part in the code it'll take out the flag or change it to something else if u change the link in that part :) by vomitgirl; 1636691438; Report Oh ok thank you!! I’ll do that then by Kasia Sledge; 1636691609; Report How do I apply this to my profile by Tammy; 1636735741; Report oh just copy the code above and paste it into your about me section by vomitgirl; 1636769718; Report
veliona	1634024826 this is SO cute i'm in love with this Report Comment
Marble	1633517268 i love this so much omg. would you be game to make one with miku specifically? Report Comment
tate	1632957253 i saw ena and knew i immediately had to use this Report Comment
xo Ash kitty xo	1630528171 thanks for this I love it! Report Comment
CRISTINE	1629811310 So cute!! Hoping seeing more layout designs from you! Report Comment
LARVAMOLT⚥	1628281565 this is so so cute and i love that it looks like the trans flag Report Comment