simple studio ghibli inspired layout

Tags: studio ghibli, rain, blue, lofi, totoro

Description:

simple studio ghibli inspired layout with rain overlay - all features there except from the special icons in nav (christmas, new years, "new" before the app link) because they get on my nerves

feel free to edit as much as you wish!! credit not needed but appreciated,, please do comment if using tho!!

any problems j lmk,, ill try and fix it as soon as i can!! still works on mobile but the font is different since its not supported when not using windows,, sorry!!

ill probably update it every so often too :))
[update: rain overlay image link stopped working, replaced it!]

Preview:

click on the image for a larger preview

Code:

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

<style>
*, nav, nav .links a, .logout-btn {
font-family: ms ui gothic!important;
text-shadow: 0px 0px 6px white;
color: white;
}
* {
cursor: url(https://cur.cursors-4u.net/symbols/sym-6/sym600.cur), auto !important;
}
.container{
max-width:100%;
width:calc(100% - 100px);
}
main, .profile .contact .heading, .profile .table-section .heading, .setting-section .heading, .home-actions .heading, .profile .blurbs .heading, .profile .friends .heading, .comments-table td:first-child, .music-table td:first-child, .comments-table td, .music-table td, .details-table td, .details-table td:first-child {
background: transparent;
}
nav .top .left .logo {
display: none;
}
nav .top .left .christmas, nav .top .left .special-icon, img[src= "https://static.spacehey.net/icons/new.png"] {
display:none;
}
.profile .contact, .profile .url-info, .profile .table-section, .setting-section, .home-actions, .comments-table {
border: none;
}
.blurbs, .blog-preview, .url-info, .contact, .friends, .table-section, .mood, .general-aboout, .profile-info, nav, footer {
background-color: #00000077;
border: 2px white dashed!important;
box-shadow: 0px 0px 4px white inset, 0px 0px 4px white;
border-radius:  10px;
}
a:any-link {
color: white;
}
.online{
content: url("https://i1.glitter-graphics.org/pub/986/986381ihw419ost5.gif");
}
h4 {
color: white;
font-weight: 700;
font-style: italic;
text-decoration: underline dashed;
}
.name {
font-size: 22px;
font-weight: 1000;
font-style: italic;
text-decoration: underline dashed;
}
body {
background-image: url(https://i.pinimg.com/originals/c2/38/5f/c2385f451fc41590977e576b70ad0a95.jpg);
background-attachment: fixed;
background-size: cover;
background-repeat:none;
}
html:before {
  animation: grain 8s steps(10) infinite;
  background-image: url(https://i.postimg.cc/R0MbwcvD/rain-overlay.gif);
  content: "";
  height: 300%;
  left: -50%;
  opacity:.4;
  top: -110%;
  width: 300%;
  position: fixed;
pointer-events:none;
}

a:not(.friends a):hover, nav .links a:hover {
background-color: transparent;
background-image: url(https://wdlus.carrd.co/assets/images/gallery02/fc330a37.gif?v=fa97d6b6);
background-size: cover;
text-decoration: none;
color: #b2c0ce;
text-shadow: 0px 0px 6px #b2c0ce;
transition: 0.5s;
}
.top .left a:after {
content: "spacehey.com";
}
nav .links li:not(:last-child)::after, footer .links li:not(:last-child)::after {
  content: " : ";
  color: white;
}
nav .top, nav .links, h4, h1, .url-info b, .friends b, .details-table td:first-child p, .contact a {
background-color: transparent;
text-transform: uppercase;
}
.comment-replies, .comments-table td:first-child, .music-table td:first-child, .comments-table td:last-child, .music-table td:last-child {
border: 2px dashed white;
}
.comments-table td:last-child, .music-table td:last-child {
border-top: none;
border-left: none;
border-right:none;
}
.comments-table td:first-child, .music-table td:first-child {
border-top: none;
border-left: none;
}
.comments-table tr:last-of-type td:first-child, .music-table tr:last-of-type td:first-child, .comments-table tr:last-of-type td:last-child, .music-table tr:last-of-type td:last-child{
border-bottom:none;
}
.comment-replies {
border-left: none;
border-bottom:none;
border-right:none;
}
.count, .profile .blurbs .section h4 {
color: skyblue;
}
nav .links .icon {
content: url(https://wdlus.carrd.co/assets/images/gallery01/a0c81117.gif?v=fa97d6b6);
}
button, input {
color:black;
text-transform:uppercase;
}
.contact img, .details-table .icon {
filter: grayscale(1) invert(1) brightness(3);
}
.profile .friends .person p {
color:white;
}
.general-about .profile-pic img, .table-section .person a img {
-webkit-mask-image: url(https://i2.glitter-graphics.org/pub/1108/1108152vyqekpis14.gif);
-webkit-mask-size: 100%;
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center;
position:relative;
transform:scale(1.025,1.025);
top:-0.25em;
max-width: 130px;
}
.pfp-fallback:hover {
filter: saturate(1.5);
transition: 0.4s;
border-radius: 0px;
}
.pfp-fallback {
filter: saturate(0.2);
transition: 0.4s;
border-radius: 100px;
}
.profile h1 {
background: url(https://wdlus.carrd.co/assets/images/gallery05/e4f40e30.gif?v=fa97d6b6) no-repeat right;
}
</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 50 comments ( View all | Add Comment )

sam !	1737340529 using!! Report Comment
avery	1737289404 using Report Comment
⟡˙⋆bird⋆˙⟡	1737003686 using! tyy! Report Comment
4stro	1736739175 usinggg Report Comment
Fl4v0urs0fFr31ndsh1p	1736168601 Usinggg <3 Report Comment
zosia	1734880723 usinggg, such a cute layout!! Report Comment aw tyy enjoy!! <3 by woodlouse; 1734905282; Report
Gaia	1733614024 using, thank you ^^ Report Comment
insomniac	1732567093 using with some very small modifications. Report Comment sounds great!!! enjoy :D by woodlouse; 1732567618; Report
ellie ☆	1730803657 using!! Report Comment
TAMMI !! 🌟	1729871126 using ! Report Comment
Yuri	1728235095 using!!! Report Comment
ᴄᴀᴅᴇɴ✶⋆.˚꩜ .ᐟ˙⋆✶	1728056797 Using!! Report Comment
Yessica	1727885012 awesome work! im using it. i love it! thanks for sharing! Report Comment
Gorgoe	1723847084 using! Report Comment
Pixel	1722977597 using! Report Comment
𝔙𝔢𝔫𝔦𝔦	1722861739 using !! Report Comment
Chubby Rat	1722270674 This so so cute! Using<3 Report Comment
amber[semi-active]	1721941319 usijng Report Comment
gamma ！？	1721883102 using ♪(๑ᴖ◡ᴖ๑)♪ Report Comment
rollypolly	1718476388 using B) Report Comment