Blue Studio Ghibli Aesthetic

Tags: studio ghibli, blue, pixels, stars, my neighbor totoro, spirited away

Description:

Really just uploaded this for archiving purposes ^_^ Feel free to use! :)

Preview:

click on the image for a larger preview

Code:

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

<style>
/* LAYOUT MADE BY DARREN (https://spacehey.com/reversebeartrappd)
*
* Used: Tommy Panzram's Layout Editor (https://heroin-bob.github.io/SpaceHeyLayoutEditor)
*
* Inspiration Credits To: Zyozi (https://spacehey.com/zyozi), Idioteque (https://spacehey.com/coedcaine), Woodlouse (https://spacehey.com/woodlouse), and ESPECIALLY, Samsux (https://spacehey.com/samsux)
*
*
* FEEL FREE TO:
* COPY THE ENTIRE LAYOUT
* AND
* RIP PIECES OF CODE
*
* THIS LAYOUT IS NOT VERY OPTIMIZED! SORRY!!
* I ALSO AM NOT THE BEST AT CODING AND HAVE VERY UNHEALTHY INTERNET PRACTICES
*
* IF YOU DO USE MY CODE:
* TAG OR MESSAGE ME! I WOULD LIKE TO SEE IT IN ACTION! NO PRESSURE!
* FEEL FREE NOT TO CREDIT ME, I DONT MIND!
*
* MADE: 30/12/23
* LAST EDITED: 9/1/24
*
* TRANS & QUEER RIGHTS, BLACK LIBERATION AND INDIGENOUS SOVEREIGNTY */

/* ROOT COLORS */

:root {

 --off-white: #F1F1F1;
 --white: #FFFFFF;
 --gray: #CCCCCC;
 --blue: #567296;
 --light-blue: #698bb8;
 --border-blue: #35465c;
  
}

/* PROFILE WIDTH + FONT */

@font-face {
font-family: 'Determination';
src:url(https://dl.dropbox.com/s/43esi8tpxce4q3f/DeterminationMonoWebRegular-Z5oq.ttf?dl=0;)
}

.container {
 
 width: 1050px;
 height: 650px!important;
 overflow-y: auto;
 cursor: url('http://www.rw-designer.com/cursor-extern.php?id=24615'), auto!important;
 font-family: 'Determination';

}

/* SCROLLBAR */
 
/* FIREFOX */
  
* {
   
  scrollbar-width: auto;
  scrollbar-color: #567296 #f1f1f1;
  
}

/* CHROME, EDGE, and SAFARI */
 
*::-webkit-scrollbar {
  
  width: 8px;
  
}

*::-webkit-scrollbar-track {
    
    background: #f1f1f1;
  
}

*::-webkit-scrollbar-thumb {
    
  background-color: #567296;
  border-radius: 0px;
  border: 0px none #ffffff;
  
}

/* TEXT COLORS + CURSOR + ONLINE */

* {
  
  cursor: url('http://www.rw-designer.com/cursor-extern.php?id=24615'), auto!important;
  
}

.online {
  
  color: var(--border-blue)!important;
  
}

.online img {
  
  visibility: hidden!important;
  
}

p {
  
  color: var(--border-blue)!important;
  
}

a:hover {
  
  color: var(--border-blue);
  
}

.count {
  
  color: var(--blue);
  
}

/* MAIN COLORS */

 html:before {
  
  animation: grain 8s steps(10) infinite;
  background-image: url(https://external-media.spacehey.net/media/s8jt3S7IeHGER3WhJoWLp71gTJlUQzr_oBOHUoSkX5YU=/https://i.pinimg.com/564x/36/14/1a/36141adb3537f5ca03e0d3c9402bf2fe.jpg);
  content: "";
  height: 300%;
  left: -50%;
  opacity:.2;
  position: fixed;
  top: -110%;
  width: 300%;
  pointer-events:none;
  z-index: -2;

}

@keyframes grain {
  0%, 100% { transform:translate(0, 0) }
  10% { transform:translate(-5%, -10%) }
  20% { transform:translate(-15%, 5%) }
  30% { transform:translate(7%, -25%) }
  40% { transform:translate(-5%, 25%) }
  50% { transform:translate(-15%, 10%) }
  60% { transform:translate(15%, 0%) }
  70% { transform:translate(0%, 15%) }
  80% { transform:translate(3%, 35%) }
  90% { transform:translate(-10%, 10%) }

}

body {
  
  background-image: url('https://file.garden/ZYCtlG2nsi-rTEoR/ghibli.png');
  background-repeat: no-repeat;
  background-position: center fixed;
  background-size: 100%;
  cursor: url('http://www.rw-designer.com/cursor-extern.php?id=24615'), auto!important;
  
}

nav .top {
  
  background-color: var(--blue);
  color: var(--white)!important;

}

.top .right {
  
  color: var(--white)!important;
  
}

nav .links {
  
  background-color: var(--light-blue);
  text-align: center;

  
}

.links a {
  
  text-shadow: none!important;
  color: var(--white)!important;
  
}

.pagination {
    display:none;
}
nav .links li:first-letter, nav .links a:first-letter {
  text-decoration: underline;
}
.details p:nth-of-type(2) {
  margin: 2px;
}

nav .links li:not(:last-child)::after, footer .links li:not(:last-child)::after {
  
  content: "";
  
}

nav .links .icon:not(img[src="https://static.spacehey.net/icons/new.png"]) {
    content:url("https://file.garden/ZYCtlG2nsi-rTEoR/sprig.gif");
}

.input {
  
  background-color: var(--white)!important;
  border: 6px ridge var(--border-blue)!important;
  
}

main {
  
  background-color: var(--white);
  color: var(--border-blue)!important;
  cursor: url('http://www.rw-designer.com/cursor-extern.php?id=24615'), auto;
  
}

footer {
  
  background-color: transparent!important;
  
}

.blurbs {
  
  border: 2px solid var(--blue)!important;
  
}

.blurbs .heading {
  
  background-color: var(--blue)!important;
  color: var(--white)!important;
  text-align: center!important;
  font-size: 12px;
  
}

.profile .blurbs .section h4 {
  
  display: none;
  
}

.blurbs .inner .section:last-of-type h4 {
  
  font-size: 0px!important;
  
}

.blurbs .inner {
  
  max-height: 800px!important;
  overflow-y: auto!important;
  background-color: var(--off-white);
  
  
}

.friends .heading {
  
  background-color: var(--blue)!important;
  color: var(--white)!important;
  text-align: center!important;
  font-size: 12px;
  
}

.friends .inner {
  
  max-height: 150px;
  overflow-y: auto;
  background-color: var(--off-white)!important;
  
}

.profile .friends .person img {
  
  clip-path: polygon(50% 0%, 67% 29%, 98% 35%, 75% 58%, 79% 91%, 50% 75%, 21% 91%, 25% 58%, 2% 35%, 33% 29%)

}

table.comments-table td {
  
  background-color: var(--off-white)!important;
  padding: 3px;
  
}

#comments .inner {
  
  max-height: 283px;
  overflow-y: auto;
  
}


.blog-entry .profile-pic:after, .bulletin .profile-pic:after { 
  
  background-size: cover; 
  width: 110px; 
  height: 110px; 

} 

.general-about .profile-pic:after { 
  
  background-size: cover; 
  width: 160px; 
  height: 160px; 

}

.contact .heading {
  
  background-color: var(--blue)!important;
  border: 0px!important;
  
}

.contact {
  
  background-color: var(--off-white)!important;
  border: 2px solid var(--blue)!important;
  
}

.url-info {
  
  background-color: var(--off-white)!important;
  border: 2px solid var(--blue)!important;
  
}

.table-section .heading {
  
  background-color: var(--blue)!important;
  
}

.table-section {
  
  background-color: var(--off-white)!important;
  border: 2px solid var(--blue)!important;
  
}

.table-section td {
  
  background-color: var(--off-white)!important;
  border: 1px solid var(--blue)!important;
  padding: 1px;

  
}

.profile .table-section {
  
  display: block;
  max-height: 450px;
  overflow-y: auto;
  
}

.profile-info {
  
  background-image: url('https://i.pinimg.com/originals/f0/4a/0f/f04a0f964e22f64a08e892c9496f1864.gif');
  background-position: center!important;
  height: 300px!important;
  font-size: 0px!important;
  border: 0px!important;
  
}

.contact .inner a img {

  font-size: 0;

}

.contact .inner a img:before {

  font-size: 1em;
  display: block;

}

.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {

  /* Add to Friends */
  content: url('https://file.garden/ZYCtlG2nsi-rTEoR/toto.gif');

}

.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
	
  /* Add to Favorites */
  content: url('https://file.garden/ZYCtlG2nsi-rTEoR/bluedino.gif');

}

.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
	
  /* Send Message */
  content: url('https://file.garden/ZYCtlG2nsi-rTEoR/cat.webp');

}

.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
	
  /* Forward to Friend */
  content: url('https://file.garden/ZYCtlG2nsi-rTEoR/penguin.webp');

}

.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {

  /* Instant Message */
  content: url('https://file.garden/ZYCtlG2nsi-rTEoR/moomin.webp');

}

.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
	
  /* Block User */
  content: url('https://file.garden/ZYCtlG2nsi-rTEoR/catt.webp');

}

.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
	
  /* Add to Group */
  content: url('https://file.garden/ZYCtlG2nsi-rTEoR/hippo.webp');

}

.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
	
  /* Report Profile */
  content: url('https://file.garden/ZYCtlG2nsi-rTEoR/badtz.webp');

}

 .logo {
  
  content: url('https://file.garden/ZYCtlG2nsi-rTEoR/shstarlogo.png');

}

/* CUSTOMIZABLE STUFF */

.pinned {
  
  content: url('https://file.garden/ZYCtlG2nsi-rTEoR/spinstar.gif');
  
}

ul {
  
  list-style-image: url('https://file.garden/ZYCtlG2nsi-rTEoR/spinstar.gif');
  
}

ol {
 
 list-style-image: url('https://file.garden/ZYCtlG2nsi-rTEoR/spinstar.gif');
  
}

img[src="https://static.spacehey.net/icons/new.png"] {

  display: none;

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

sabaaall0	1731521762 usingg ÑEÑÑEEÑEÑ Report Comment
helena ☆	1731368114 using >_< Report Comment
isa	1730501725 using :)) Report Comment
Latey	1730238554 using! Report Comment
⭑lanly	1728918998 Using :p Report Comment
Oatmeal	1728437108 using :3 Report Comment
emie!	1727279430 usingg Report Comment
alliw ! 👾🇧🇷	1726008812 usando!! Report Comment
K.M.S	1725797711 Using:3 Report Comment
KierArt	1725220646 Using :D Report Comment
Elliana!!	1725079474 using!! Report Comment
Nina✩	1724618842 Usingg!! Report Comment
soap_perchance	1724255571 TYSM!!!! I'm gonna use this :) Report Comment
monarko	1724101252 using! Report Comment
choco	1723327796 Using ! Report Comment
kaneko	1723206179 Using Report Comment
Yu	1723146748 Usando!!!! Report Comment
alliw ! 👾🇧🇷	1722661457 usando! Report Comment
JOEY ➶ ｡˚	1722154663 using !! Report Comment
MΛXYYY	1722131270 using!! Report Comment