dark academia

Tags: dark academia, aesthetic, fall, brown

Description:

hihi! this is my first layout other than my own so i hope it's ok ^^ it autoplays lacrimosa by mozart (classical music :3) it's also floating and has a loading screen :) have fun with it !!! pls credit if used <3 comments are appreciated !

Preview:

click on the image for a larger preview

Code:

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

<style>

body:before {
content: " ";
height: 100vh;
width: 100vw;
display: block;
position: fixed; 
top: 0; 
left: 0; 
z-index: 100;
background-image: url('https://68.media.tumblr.com/9cb415377485f71e43c22962ad4340e5/tumblr_oj4gyhs8h11tliyzbo1_500.gif');
background-size: cover;
background-repeat: no-repeat;
background-position:center;
animation: yourAnimation 2s ease 0s 1 normal forwards;
pointer-events: none;}
@keyframes yourAnimation { 0.0%{ opacity: 1;} 75%{ opacity: 1; } 100%{ opacity: 0;} } 

    body{
        background-image: url('https://www.passporttoeden.com/wp-content/uploads/2022/09/DarkAcademiaLibraries_Featured-1-of-1.jpg');
        background-size: 300px;
    }
 
img {
  opacity: 0.65;
}

:root {
 --logo-blue: #65350f;
 --darker-blue: #65350f;
 --lighter-blue: 
;
 --even-lighter-blue: ;
 --lightest-blue: #65350f;
 --dark-orange: ;
 --light-orange: ;
 --even-lighter-orange: ;
 --green: ;
}

@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Serif&display=swap');

p{
font-family: 'IBM Plex Serif', serif; font-size: 125%;
color: #9a7b4f;
}

h1,h2,h3,h4,h5{
font-family: 'IBM Plex Serif', serif; font-size: 125%;
color: #9a7b4f ;
} 

    .container{
    animation-name: floating;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}
 
@keyframes floating {
    0% { transform: translate(0,  0px); }
    50%  { transform: translate(0, 10px); }
    100%   { transform: translate(0, -0px); }   
}

 main{
    animation-name: floating;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}
 
@keyframes floating {
    0% { transform: translate(0,  0px); }
    50%  { transform: translate(0, 10px); }
    100%   { transform: translate(0, -0px); }   
}

.profile {
background: #4a2511
} 
  
footer {   
 background: #4a2511!important;
}

.online {content: url('https://external-media.spacehey.net/media/sZ10UD7HGugtmb4uv7uYwqPX0N-BoHLUICWheNh9SSaQ=/https://64.media.tumblr.com/224850c8ac87c9faaf659d52d6cde0b5/400680e601e06838-a3/s75x75_c1/3b37a62f126d731a3ee6faf6e3d78964294a1a25.gifv');} 

.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 {content: url('https://external-media.spacehey.net/media/sTImIWqmvRspJHgTPazdAIZKCMv_xR0j79DTvii-aUHw=/https://64.media.tumblr.com/a47167c5f24711f71fe256abcdd180b5/ff126366c4ec20ef-e4/s75x75_c1/163c5341cec3e013c53f5295ec5f6603a3ab5c12.gifv')}
/*ADD TO FRIENDS*/
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {content: url('https://external-media.spacehey.net/media/sTImIWqmvRspJHgTPazdAIZKCMv_xR0j79DTvii-aUHw=/https://64.media.tumblr.com/a47167c5f24711f71fe256abcdd180b5/ff126366c4ec20ef-e4/s75x75_c1/163c5341cec3e013c53f5295ec5f6603a3ab5c12.gifv')}
/*ADD TO FAVORITES*/
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {content: url('https://external-media.spacehey.net/media/sTImIWqmvRspJHgTPazdAIZKCMv_xR0j79DTvii-aUHw=/https://64.media.tumblr.com/a47167c5f24711f71fe256abcdd180b5/ff126366c4ec20ef-e4/s75x75_c1/163c5341cec3e013c53f5295ec5f6603a3ab5c12.gifv')}
/*SEND MESSAGE*/
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {content: url('https://external-media.spacehey.net/media/sTImIWqmvRspJHgTPazdAIZKCMv_xR0j79DTvii-aUHw=/https://64.media.tumblr.com/a47167c5f24711f71fe256abcdd180b5/ff126366c4ec20ef-e4/s75x75_c1/163c5341cec3e013c53f5295ec5f6603a3ab5c12.gifv')}
/*FORWARD TO FRIEND*/
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {content: url('https://external-media.spacehey.net/media/sTImIWqmvRspJHgTPazdAIZKCMv_xR0j79DTvii-aUHw=/https://64.media.tumblr.com/a47167c5f24711f71fe256abcdd180b5/ff126366c4ec20ef-e4/s75x75_c1/163c5341cec3e013c53f5295ec5f6603a3ab5c12.gifv')}
/*INSTANT MESSAGE*/
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {content: url('https://external-media.spacehey.net/media/sTImIWqmvRspJHgTPazdAIZKCMv_xR0j79DTvii-aUHw=/https://64.media.tumblr.com/a47167c5f24711f71fe256abcdd180b5/ff126366c4ec20ef-e4/s75x75_c1/163c5341cec3e013c53f5295ec5f6603a3ab5c12.gifv')}
/*BLOCK USER*/
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {content: url('https://external-media.spacehey.net/media/sTImIWqmvRspJHgTPazdAIZKCMv_xR0j79DTvii-aUHw=/https://64.media.tumblr.com/a47167c5f24711f71fe256abcdd180b5/ff126366c4ec20ef-e4/s75x75_c1/163c5341cec3e013c53f5295ec5f6603a3ab5c12.gifv')}
/*ADD TO GROUP*/
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {content: url('https://external-media.spacehey.net/media/sTImIWqmvRspJHgTPazdAIZKCMv_xR0j79DTvii-aUHw=/https://64.media.tumblr.com/a47167c5f24711f71fe256abcdd180b5/ff126366c4ec20ef-e4/s75x75_c1/163c5341cec3e013c53f5295ec5f6603a3ab5c12.gifv')}
/*REPORT PROFILE*/

</style>

<iframe width="0" height="0" src="https://www.youtube.com/embed/k1-TrAvp_xs?feature=shared//?&;amp;;autoplay=1&;loop=1&;controls=1" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" loading="lazy">
</iframe>

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.