my current halloween-themed layout (9/1/23)

Tags: halloween, gif, layout, spooky, autumn, fall, orange, blue, black, purple

Description:

the layout im currently using wasn't coded by me!! this is a festive layout!! ill be changing it once fall's over (RIP 😭😭🪦🪦) - NOTE: you don't have to comment 'using' since i don't take full credit for this. if there's anything specific you're taking from my layout code's - or if you're taking it entirely - please take the time to find the individuals' profiles and comment 'using' on the layouts that helped me make mine <33 credits below: @lynn ｡･:*:･ﾟ★,｡･:*:･ﾟ☆ (https://layouts.spacehey.com/layout?id=36997) @zombieboycoal (https://layouts.spacehey.com/layout?id=37257) @ANGEL (https://layouts.spacehey.com/layout?id=38374) @bap!'s css workshop <3 (https://layouts.spacehey.com/layout?id=3633) @voxnaa (https://layouts.spacehey.com/layout?id=39559)

Code:

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

<style>

body:before {

content: " ";

height: 100vh;

width: 100vw;

display: block;

position: fixed; 

top: 0; 

left: 0; 

z-index: 100;

background-image: url(https://64.media.tumblr.com/61462a67de3c3c48674e503340ed5195/ac926009ba373921-41/s500x750/c99a9511ef6675c4e6482acedd1a8967b1f9e8c5.gifv);

background-size: cover;

background-repeat: no-repeat;

background-position:center;

animation: yourAnimation 1s ease 2s 1 normal forwards;

pointer-events: none;}

@keyframes yourAnimation { 0.0%{ opacity: 1;} 75%{ opacity: 1; } 100%{ opacity: 0;} } 

</style>

<img src="https://media.giphy.com/media/v1.Y2lkPTc5MGI3NjExMGk3bmVwaDR3NG5rb2JscmtxMGVjbnJ0aGlpbGwybDI5MjdyMzg5YiZlcD12MV9pbnRlcm5hbF9naWZfYnlfaWQmY3Q9cw/d9C4b5iKhpkEHGaAf7/giphy.gif"/>

<div style="float:  ; max-height: 400px; position: fixed; right: 1px; bottom: 9px; z-index: 200;">
<img src="https://media.tenor.com/gDaIwdVlYjYAAAAi/maxwell-cat-maxwell.gif" width="200" height="200"/></div>
<style>
</style>


<!-- (c) Layout created by lynn ｡･:*:･ﾟ★,｡･:*:･ﾟ☆ (https://layouts.spacehey.com/layout?id=36997) -->

<style>
/* this is the online img*/
.online {content:url('http://dl.glitter-graphics.com/pub/2977/2977298zohekyrym6.gif'); background-repeat: no-repeat; background-position: -15% 75%; z-index: 2; 
}
</style>

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

<style>* {cursor: url(https://cur.cursors-4u.net/holidays/hol-4/hol338.cur), auto;}</style><a href="https://www.cursors-4u.com/cursor/2009/10/14/tiny-skull-crossbones.html" target="_blank" title="Tiny Skull Crossbones"><img src="https://cur.cursors-4u.net/cursor.png" alt="Tiny Skull Crossbones" style="position:absolute; top: 0px; right: 0px;"/></a>

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

<div style="float:  ; max-height: 400px; position: fixed; left: 1px; bottom: 9px; z-index: 200;">
<img src="https://64.media.tumblr.com/984e8c2dfb5e950618dedba9f7ddaca9/c1d6ff4173b9ca5c-f1/s100x200/d4e88eaea7a4c73e76452fa283603d1086b4a796.gifv" width="150" height="150"/></div>


<!-- (c) Layout created by bap!'s css workshop <3 (https://layouts.spacehey.com/layout?id=3633) -->

<style>

main {
    background: #f9c93300;
}

main {
    background: transparent;
    color: #f2f2f2;
    padding: 6px 0px;
    font-size: 80%;
}

:root {
    --even-lighter-blue: #FF;
    --lightest-blue: #FF;
    --light-orange: white;
    --even-lighter-orange: white;
    --dark-orange: black;
    --logo-blue: solid;
    --darker-blue: #00;
    --lighter-blue: #f9c93300;
}

body, .bodyContent {
    font-family: "MS PGothic"!important;
    text-transform: lowercase;
    text-shadow: 0px 0px 5px;
    letter-spacing: 2px !important;
    font-size: medium !important;
    text-align: center;
    image-rendering: pixelated;
    background-image: url(https://64.media.tumblr.com/3463faccbc2038df9100c0a553852c58/tumblr_inline_panmv5fv0H1r63cto_500.png);
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
}

main:before {
    width: 100%;
    height: 250px;
    display: block;
    content: "";
    background-image: url(https://64.media.tumblr.com/ed5f44d7f5336966f43865186201d43a/tumblr_inline_panmvl7K2O1r63cto_250.gifv);
    background-position: center center;
    background-size: cover;
}

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

form::after {
    content: url(https://i.imgur.com/6EWUV2p.png);
    position: fixed;
    left: 0;
    bottom: 0;
}

footer {
    margin: 5px;
    border: 1px solid transparent!important;
    background: #ffffff00;
    border-radius: 2px;
    padding: 10px;
}

.profile .blurbs .heading, .profile .friends .heading {
    background: #f9c56c;
    background: #ffffff00;
    color: #ED0707;
    color: #f2f0f0;
    padding: 2px 7px;
}

.profile .blurbs .section h4 {
    margin: 0;
    color: #ED0707;
    color: #f2f0f0;
}

.mood, .contact, .table-section, .blog-preview, .blurbs, .friends, #comments.friends, .profile-info {
    margin: 5px;
    border: 5px solid #725257!important;
    background: #100f11;
    border-radius: 2px;
    padding: 10px;
}

.mood:after {
    content: "" url(https://64.media.tumblr.com/a8d678912233115988e866c458fe63ed/tumblr_inline_p7gbo4qOTy1rpglid_250.gifv);
}

body > div > main > div > div.col.w-40.left > div.contact > div.inner > div> div> a::before {
    content: url(https://64.media.tumblr.com/f9dbb92e8045efb9582302b7f0deeadb/tumblr_inline_panmw5Pbtp1r63cto_75sq.gifv);
}

.comments-table td:first-child, .music-table td:first-child {
    background: #f9c56c;
    background: #725257;
    text-align: center;
    font-weight: bold;
    width: 38%;
}

.comments-table td, .music-table td {
    background: #fcdbb8;
    background: #4b414c;
    vertical-align: top;
}

body > div > main > div > div.col.w-40.left > div.contact > div.inner > div > div > a > img.icon {
    display: none;
}

.count {
    color: #725257;
}



</style>

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

<style>
/*hover img*/
.profile-pic, .profile-pic img, .comments-table img, .friends img{
transition: all 0.5s;
display: block;
transition: 1s ease;
-webkit-mask-image: url('https://dl.dropbox.com/s/2kih8ox9q2czjeg/pngfind.com-kawaii-transarent-png-621355.png');
-webkit-mask-size: 220%;
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center;

}

.profile-pic:hover, .profile-pic img:hover, .comments-table img:hover, .friends img:hover{
transition: all 0.5s;
-webkit-mask-image: url('https://dl.dropbox.com/s/2kih8ox9q2czjeg/pngfind.com-kawaii-transarent-png-621355.png');
-webkit-mask-size: 100%;
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center;

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