Cute Kawaii layout

Tags: cute, pastel, katie, pink

Description:

If you like this style, you can use it in your profile, BUT at least, ADD ME or COMMENT BELOW and give me some kudos! I spent time for making this layout!!!

Credits are appreciated (a post, a bulletin or something else that can support me)

You have permission to use this for your Layout only, you don't have permission to post elsewhere without giving a link to the original crediting me

Preview:

click on the image for a larger preview

Code:

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

<style>

footer {
        border-radius: 15px;
background-image: url(https://i.pinimg.com/originals/43/77/7a/43777aabdfd50ec9184e63cb07919f62.gif); 

</style>


<style>

table {
  border-spacing: 8px;
width: 100%;
background-image: url(https://i.pinimg.com/originals/43/77/7a/43777aabdfd50ec9184e63cb07919f62.gif); 

</style>

<style>

body:before {
 content: " ";
 height: 50vh;
 width: 100vw;
 display: block;
 position: fixed;
 top: 0;
 left: 0;
 background-image: url('https://i.pinimg.com/originals/43/77/7a/43777aabdfd50ec9184e63cb07919f62.gif');
 z-index: 100;
 background-size: cover;
 background-repeat: no-repeat;
 background-position: center top;
 animation: doorUp 3s ease 0s 1 normal forwards;
 pointer-events: none;
}

body:after {
 content: " ";
 height: 50vh;
 width: 100vw;
 display: block;
 position: fixed;
 bottom: 0;
 left: 0;
 background-image: url('https://i.pinimg.com/originals/43/77/7a/43777aabdfd50ec9184e63cb07919f62.gif');
 z-index: 100;
 background-size: cover;
 background-repeat: no-repeat;
 background-position: center bottom;
 animation: doorDown 3s ease 0s 1 normal forwards;
 pointer-events: none;
}

@keyframes doorUp { 0.0%{ } 75%{ transform: translate(0,0); } 100%{ transform: translate(0,-50vh); } } 
@keyframes doorDown { 0.0%{ } 75%{ transform: translate(0,0); } 100%{ transform: translate(0,50vh); } } 


<style>

:root {
  --topic1: "Intro";
  --topic2: "🎤🎧🎵";
  --topic3: "Movies/TV Shows";
  --topic4: "Things I like";
  --topic5: "Books/Writers";
  --topic6: "Misc";

 }

.table-section:not(:last-child) .details-table tr td:first-child p{color:transparent !important;text-shadow: none !important;letter-spacing: -100px;}

.details-table tr td:first-child p::after{
  color:var(--links) !important;
  letter-spacing:normal !important;
   text-shadow: 2px 2px pink !important;
   filter: brightness(95%) !important;
}
.table-section:not(:last-child) .details-table tr:nth-child(1) td:first-child p::after{
  content: var(--topic1);
}
.table-section:not(:last-child) .details-table tr:nth-child(2) td:first-child p::after{
  content: var(--topic2);
}
.table-section:not(:last-child) .details-table tr:nth-child(3) td:first-child p::after{
  content: var(--topic3);
}
.table-section:not(:last-child) .details-table tr:nth-child(4) td:first-child p::after{
  content: var(--topic4);
}
.table-section:not(:last-child) .details-table tr:nth-child(5) td:first-child p::after{
  content: var(--topic5);
}
.table-section:not(:last-child) .details-table tr:nth-child(6) td:first-child p::after{
  content: var(--topic6);
}




main:before {
 width: 100%;
 height: 300px;
 display: block;
 content: "";
 background-image: url('https://media1.tenor.com/images/9d47bdd4551877a39a7c29a870f98855/tenor.gif?itemid=15212149');
 background-position: center center;
 background-size: cover;
}
@media only screen and (max-width: 600px) {
 main:before{
  height: 200px;
 }
}


@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@400;600&amp;display=swap');


*{
color: pink ;
}




Body{
background-color:ffffff;
background-image:url(https://images.squarespace-cdn.com/content/v1/55bd282ee4b0681497f83470/1546284406938-V59XZX9MM0DHMZS71FT3/ke17ZwdGBToddI8pDm48kDb8KzzF6BlGaXkZSOcDU7BZw-zPPgdn4jUwVcJE1ZvWhcwhEtWJXoshNdA9f1qD7ZLZV9jqlBnedHoWlUQpM3VFvT4a4lm2AbTKyIPZjfCiYHHPq0m3LKL0MmGOi0svTA/IMG_4330.gif);
background-position:Bottom Left;
background-attachment:fixed;
background-repeat:repeat;
}

</style>

<style>


  h1, h2, h3, h4, h5, a, p, nav label, .section{ 
font-family: var(--font-family) !important; 
 text-shadow: !important;
 text-transform:!important;
}


h1, h2, h3, h4,h5,a, p, nav label, .section {color: #A941B0;}

h1 {
  color: #f994ff ;
  text-shadow: 1px 1px 2px black, 0 0 25px yellow, 0 0 5px yellow;
}


table, th, td {
  border: 1px solid #f994ff ;
}

  
 
:root {
        --logo-blue: #A941B0;
        --darker-blue: ;
        --lighter-blue: #A941B0;
        --even-lighter-blue:#A941B055 ;
        --lightest-blue:#A941B055 ;
        --dark-orange: purple;
        --light-orange:#A941B055 ;
        --even-lighter-orange:#A941B055 ;
        --green: Aliceblue;
    }

main {
  /* sets background */
    background-image: url(https://i.pinimg.com/originals/8d/54/90/8d5490a9896c79c96537a6f7df1210f9.gif);
    background-repeat: repeat;
    background-size: 50% ;
  }

</style>

<style>


.search-wrapper input[type=text] {background-color: pink !important;border: 1px solid var(--headers) !important;color:var(--names) !important;border-radius: 10px !important;}
button{border-radius: 10px !important;border: 1px dotted var(--headers) !important;font-family: var(--font-family) !important;background-color:rgba(15, 0, 0, 0.5) !important;color:var(--headers) !important;}

.profile .contact,
    .profile .url-info,
    .profile .table-section,
    .home-actions {
        border: green none;
    }

    
    

    a.ditto-link {
        display: block;
        margin: 10px 0;
        color: #cc3e3e;
        font-size: 1.4rem;
        font-weight: bold;
        animation: blinker 1s linear infinite;
    }

    .profile-pic {
        border-radius: 500px;
        overflow: hidden;
    }

    .heading {
        padding: 5px 0 !important;
        margin-top: 15px;
        margin-bottom: 10px;
        background-color: transparent !important;
        color: #2a2a2a !important;
        border-bottom: 2px solid;
    }

   

    .container {
        border-radius: 15px 15px 0 0;
        overflow: hidden;
        margin-top: 30px;
        padding: 10px;
    }

    

    table.comments-table td {
        background-color: !important;
    }

    .comments-table td:first-child img {
        width: 80px;
        border-radius: 500px;
    }

    .profile .friends .person img {
        border-radius: 500px;
    }

    .blog-preview p {
        font-size: 1.4rem;
    }

</style>


<style>


body > div.container > main > div > div.col.w-40.left > div.contact > div.inner > div > div > a { visibility: hidden; }

body > div.container > main > div > div.col.w-40.left > div.contact > div.inner { margin: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; }

body > div.container > main > div > div.col.w-40.left > div.contact > div.inner > div:nth-child(1) > div:nth-child(1) > a { content:url("https://media3.giphy.com/media/dCERkihZ9m7xjIvSau/giphy.gif"); visibility: visible; height: 30px; width: 32px; }

body > div.container > main > div > div.col.w-40.left > div.contact > div.inner > div:nth-child(1) > div:nth-child(2) > a { content: url("https://cdn.pixabay.com/photo/2016/08/29/13/55/heart-1628313_960_720.png"); visibility: visible; height: 30px; width: 32px; }

body > div.container > main > div > div.col.w-40.left > div.contact > div.inner > div:nth-child(2) > div:nth-child(1) > a { content: url("https://www.kindpng.com/picc/m/185-1853706_purple-envelope-icon-hd-png-download.png"); visibility: visible; height: 20px; width: 32px; }

body > div.container > main > div > div.col.w-40.left > div.contact > div.inner > div:nth-child(2) > div:nth-child(2) > a { content: url("https://icons.iconarchive.com/icons/graphicloads/100-flat-2/256/arrow-forward-icon.png"); visibility: visible; height: 20px; width: 32px; }

body > div.container > main > div > div.col.w-40.left > div.contact > div.inner > div:nth-child(3) > div:nth-child(1) > a { content: url("https://i.pinimg.com/originals/df/d0/b0/dfd0b0f00a35b820aa28aa22e3c2782f.gif"); visibility: visible; height: 30px; width: 32px; }

body > div.container > main > div > div.col.w-40.left > div.contact > div.inner > div:nth-child(3) > div:nth-child(2) > a { content: url("http://www.skamu.com/free-icons/gothic/images/sign018.gif"); visibility: visible; height: 30px; width: 32px; }

body > div.container > main > div > div.col.w-40.left > div.contact > div.inner > div:nth-child(4) > div:nth-child(1) > a { content: url("https://i.pinimg.com/originals/99/69/d2/9969d2bc836ee216a3319d0c15d8ad35.gif"); visibility: visible; height: 30px; width: 32px; }

body > div.container > main > div > div.col.w-40.left > div.contact > div.inner > div:nth-child(4) > div:nth-child(2) > a { content: url("https://66.media.tumblr.com/0121952107dcbc3e73e79001c35c8171/a0304b6053744dc7-d6/s540x810/fdf3207069b0160b57e9d507af2489dcd093f544.gif"); visibility: visible; height: 30px; width: 32px; }

#comments > div.inner > table > tbody > tr > td > p.report > a { visibility: hidden; }
#comments > div.inner > table > tbody > tr > td > p.report > a { content: url("https://i.pinimg.com/474x/1a/ec/1c/1aec1cd8c5262a3c3d5b686968806e88.jpg"); visibility: visible; height: 30px; width: 32px; float: right; }
</style>

<style>

.online{content:url("http://dl5.glitter-graphics.net/pub/369/369195adsuu9rgnl.gif");}

.friends-grid {
        visibility:hidden; display:none;
    }
.friends {
    overflow: scroll;
    overflow-x: scroll;
    overflow-x: hidden;
    height: 300px; 
}


</style>

<style>

.comment-replies {border:5px dotted #FF00FF}; 
</style>


<style>
   /* Hide the friends-grid */
  .profile .blurbs .heading {
    display:none !important;
  }
 
  .friends-grid {
  display: none;
  }
 
  .top-eight {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: repeat(4, [col] auto ) ;
  grid-template-rows: repeat(2, [row] auto );
  background-color: transparent;
  color: pink;
  margin: 0px;
  width: 100%;
  }
 
  .top-eight-header {
    grid-column: col 1 / span 4;
    grid-row: row 1;
    background-color: rgb(19, 97, 118);
    color: rgb(240, 104, 103);
    font-weight: bold;
    padding: 0px !important;
  }
 
  .top-eight-header p {
    padding-bottom: 0px !important;
    margin-botton: 0px;
  }
 
  .one-four{
    grid-column: col 1 / span 4;
    grid-row: row 2;
  }
 
  .five-eight{
    grid-column: col / span 4;
    grid-row: row 3;
  }
 
 
 
.profile .blurbs .section p {
font-size: 15px;
text-align: center;
}
 
.profile .top-eight .person img {
border-radius: 50%;
width: 50px;
height: 50px;
}
 
.profile .blurbs .section h4 {
display: none;
}
 
 
</style>
 


<style>

.details-table{
display: block;
height: 200px;
overflow-y: scroll;
}
.<div style="height:200px;overflow-y:scroll;background-color:#00000055;color:#FFFFFF55;">
	



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

4L0R3_555	1737078305 Using X3 Report Comment
Autumn! :D	1735011194 using Report Comment
NIN	1733137027 Using Report Comment
xiv	1724196377 using Report Comment
Loliebas	1717841627 using Report Comment
Satan	1714665186 Using Report Comment
yumi	1706327654 this is the first layout Report Comment
Ginni-beeeeeee	1705919033 looks absolutely adorable!,using Report Comment
𝓐. ׅ♡ ֺ	1688812039 How did you get the interests to change format? Report Comment
Ross	1679430347 Using! (Probably) Report Comment
Magpie_Pastries	1674392701 cute! Report Comment
.+* pip 💕	1674239690 awhh using!!! Report Comment
Kristy	1667065545 using it ! its so cutee !!!! Report Comment
shay shay !<3	1650550546 thanks! Report Comment
Wendy	1614301446 Super cute. Report Comment
🌟Nerd On A Spaceship🌟	1611640788 Cute!! :) Report Comment
Carmz	1611366498 This is adorable!! I'm going to use it and tweek it to work with what I have now, if that's ok. Report Comment That is more than ok by Katie; 1611366678; Report