Layout published by alucard ✮

published 1676681969
updated 1734241936

Add to Favorites

View Layouts

View Profile

Report Layout

Silent Hill Fog Layout

Tags: silent hill, horror, emo, animation, video game, gray, grey, horror game

Description:

hi everyone!

this is a silent hill layout i created for all you horror video game fans!

this theme includes custom:

- cursor

- background

- headers & footers

- fonts

- contact icons

- friend icon shadow

- colors

- borders

- online gif

also included:

- spinning silent hill case gif

- blinkies

- hidden profile link

- centered blurbs & friends space

- bouncing page

- computer screen effect

for a live preview this layout, copy the code below and paste it into this website:

https://genericprofileeditor.neocities.org

for a video preview this layout, click this link::

https://va.media.tumblr.com/tumblr_rq93kbYSP01z59uo0_720.mp4

let me know if anything is broken. i hope you like it! comment if using. thx! :P

Preview:

click on the image for a larger preview

Code:

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

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


<style> @import url('https://fonts.cdnfonts.com/css/nightfully-haunted'); </style>

<style>
                            @import url('https://fonts.cdnfonts.com/css/mars-project');
</style>
                

<style> 
/* Start https://www.cursors-4u.com */ * {cursor: url(http://www.rw-designer.com/cursor-extern.php?id=62271), auto !important;} /* End https://www.cursors-4u.com */

:root{
     --headers: black;
     --text: black;
     --names: black;
     --links: black;
     --hover: gray;
     --borders: 2px solid black !important;
     --background_image: url('https://64.media.tumblr.com/321e9b23d9004584b165c436c8b2bd17/a4c22bb71cf61e67-6c/s1280x1920/70d789a7a85e1102edcc71e9108817f3c71fa4ec.jpg');
     --font-family: "Verdana";
     --curve: 10px;
}
.url-info{display:none !important;} /* to hide the url */
.blurbs .heading{display:none !important;} /* to hide the blurbs heading */
h3, h4, h5, .url-info b{ color: var(--headers) !important;} /* headings*/
a{color: var(--links) !important;} /* color of links */
a:hover{color: var(--hover) !important;} /* color of links on hover */
p, h2{color: var(--text) !important;} /* color of text */
h1, .friends a p{color: var(--names) !important;} /* color of names, and friends counter */
h1, .friends a:hover p{color: var(--hover) !important;} /* color of names on hover */
nav label{color: var(--links) !important;} /* color of search */
.section h4 {color: var(--headers) !important;text-align:center;} /* aboutme & want2meet headings */
.section{color: var(--text) !important;} /* sometimes <p> is broken by embeds maybe. */
.comment-reply:not(:first-child){border-top: 3px double var(--links);} /* line in bewtween comment replies*/
.count{color:black;
}
a:hover,
a:active,
.blog-entry .kudos-btn:hover,
.blog-entry .kudos-btn:active{
    text-decoration: underline;
    text-decoration-style: wavy;
}
.logout-btn:hover,
.logout-btn:active{
    text-decoration: underline;
    text-decoration-style: wavy;
}
nav .top a:hover{
    text-decoration: underline;
    text-decoration-style: wavy;
}
nav .links a:hover{
    text-decoration: underline;
    text-decoration-style: wavy;
}
a, nav label, .section {
    font-family: var(--font-family) !important;	
    text-shadow: 0px 0px 0px black !important;
    font-size: 11px!important;
}
p {
    font-family: var(--font-family) !important;	
    text-shadow: 0px 0px 0px black !important;
    font-size: 14px!important;
}
h2, h3, h4, h5, DIV.mood > P:nth-child(1) > B, P:nth-child(2) > B{
    font-family: 'Mars-Project', sans-serif;
    text-shadow: 0px 0px 0px black !important;
    letter-spacing: .3px;
    font-size: 15px!important;
}
.icon{border:none !important;}
.blurbs{margin-top:10px !important;margin-bottom:20px !important}
.friends{margin-top:-10px !important;margin-bottom:20px !important}
.profile-info{border-radius: var(--curve) !important;}
.comment-replies{border:5px inset var(--links);}
.comments-table{border-radius: var(--curve) !important;border:none !important;}
.table-section{padding-bottom:7px !important;margin-top:20px!important}
#comments{margin-top:5px !important;padding-bottom:5px !important}
.details p:last-child{color:var(--links) !important; filter: brightness(95%);}
.mood{margin-top:10px;}
.blog-preview{margin-top:20px;}
.mood, .blog-preview{margin-bottom: 20px;}
.table-section, .blurbs, .friends{margin-bottom: 20px !important;
}
.friends{margin-top: 10px!important;}
body {
    background-image: var(--background_image) !important;
    background-color: transparent ;
    no-repeat fixed; 
    background-size:cover;
}
nav{
    background: transparent;
    background-size: cover;
    border: none;
}
nav .top {
    background: rgba(0,0,0,0.0);
}
nav .top a{
    color: var(--links)!important;
}
nav .links {
    background: transparent!important;
    background-size: 100%100%!important;
    text-align: center;
    font-size: 14px;
}
nav img.logo{
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(0%) hue-rotate(10deg) brightness(0%) contrast(100%); !important;}
nav .links li:not(:last-child)::after,
footer .links li:not(:last-child)::after{
    content: " ⋮ ";
    color: var(--text);
}
.search-wrapper input[type=text] {
    background-color: transparent !important;
    border: 2px solid var(--links) !important;
    color:black !important;
    border-radius: 10px !important;
}
button{
    border-radius: 10px !important;
    border: 0px solid black!important;
    font-family: var(--font-family) !important;
    background-color:rgba(0, 0, 0, 0.0) !important;
    color:var(--links)!important;
}
.online{content:url("https://64.media.tumblr.com/afde703196b5bf9413521ddfb9979eee/e49d4c665f341d81-9a/s1280x1920/ed79f209c157274cd1b54cb71db99673db003eec.gif");
height: 90px; width: 90px;
}
h1{
    padding-left: 30px !important;
    font-family: 'Nightfully Haunted', sans-serif;
    font-size:70px !important;
    color: black!important;
}
.profile-info{
    background: transparent;
    background-size: cover;
    border: v transparent !important;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1px 1px;
    margin-top: 30px;
    border-radius: 10px !important;
}
.profile-info .inner{
    font-weight: bold;
    text-align: center;
}
.contact {
    background: rgba(122, 122, 122, 0.5);
    background-size: cover;
    border-radius: var(--curve) !important;
    padding: 2px !important;
    border: var(--borders) !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 {
	content: url("https://64.media.tumblr.com/ad443b204405c527354ea9457b15869d/ddcd44d0d4b37efa-dc/s75x75_c1/827b0d26ead05b46f726416567f3a628aedc07ac.pnj")
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
	content: url("https://64.media.tumblr.com/ad443b204405c527354ea9457b15869d/ddcd44d0d4b37efa-dc/s75x75_c1/827b0d26ead05b46f726416567f3a628aedc07ac.pnj")
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
	content:url("https://64.media.tumblr.com/ad443b204405c527354ea9457b15869d/ddcd44d0d4b37efa-dc/s75x75_c1/827b0d26ead05b46f726416567f3a628aedc07ac.pnj")
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
	content: url("https://64.media.tumblr.com/ad443b204405c527354ea9457b15869d/ddcd44d0d4b37efa-dc/s75x75_c1/827b0d26ead05b46f726416567f3a628aedc07ac.pnj")
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
	content: url("https://64.media.tumblr.com/ad443b204405c527354ea9457b15869d/ddcd44d0d4b37efa-dc/s75x75_c1/827b0d26ead05b46f726416567f3a628aedc07ac.pnj")
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
	content: url("https://64.media.tumblr.com/ad443b204405c527354ea9457b15869d/ddcd44d0d4b37efa-dc/s75x75_c1/827b0d26ead05b46f726416567f3a628aedc07ac.pnj")
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
	content: url("https://64.media.tumblr.com/ad443b204405c527354ea9457b15869d/ddcd44d0d4b37efa-dc/s75x75_c1/827b0d26ead05b46f726416567f3a628aedc07ac.pnj")
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
	content: url("https://64.media.tumblr.com/ad443b204405c527354ea9457b15869d/ddcd44d0d4b37efa-dc/s75x75_c1/827b0d26ead05b46f726416567f3a628aedc07ac.pnj")
}
main{
    background: transparent;
    padding: 6px 0px;
    background-size: 100%;
    background-position: center;
}
.profile-pic img{
    outline:none !important;
    border-radius: 10px;
    border: var(--borders)!important;
}
.profile .friends .person img{
    border-radius: 10px;
    border: var(--borders) !important;
    filter:drop-shadow(0px 0px 0px black) !important;
}
.friends-grid{
    text-align: center;
}
.friends-grid img{
    outline:none !important;
    filter: opacity(90%) !important;
    border-radius: var(--curve) !important;
}
.inner img{
    outline:none !important;
    filter: drop-shadow(0px 0px 0px black) !important;
    border-radius: var(--curve) !important;
}
td {
    background-color: transparent!important;
}
hr{
    border: 2px inset black;
    background: transparent;
}
.heading, .url-info, .blurbs, .friends, .table, .table-section {
    background: rgba(122, 122, 122, 0.5) !important;
    border-radius: var(--curve) !important;
    padding: 2px !important;
    border: var(--borders) !important;
}
.friends, .blurbs{
    background: rgba(122, 122, 122, 0.5);
    background-size: cover;
    text-align: center;
}
.mood, .blog-preview{
    border-radius: var(--curve) !important;
    border: var(--borders) !important;
    padding: 2px !important;
}
.mood, .blog-preview {
    text-align: center;
    background: rgba(122, 122, 122, 0.5);
    background-size: cover;
    border: var(--borders) !important;
}
.table-section{
    border:var(--borders) !important;
    background: rgba(122, 122, 122, 0.5);
    background-size: cover;
    border-radius: var(--curve) !important;
}
.heading{
    background:transparent;
    padding-bottom: 4px !important;
    background-size:100%100%!important;
    text-align: center;
    border:none!important;
}
.comments-table td {
    background-image: url('') !important;
    background-size: cover;
}
.comments-table td:first-child{
    background: url('')!important;
    background-size: 50%!important;
}
.comments-table td:first-child img {
    border: var(--borders);
}
footer{
    color:black;
    text-align: center;
    font-size: 60%;
    margin: 10px 0 10px;
    padding: 10px 5px;
    background: transparent;
    background-size: cover;
}
::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}
::-webkit-scrollbar-track {
    border-radius: 0px;
    width: 1px;
    border: 5px inset DimGray;
}
::-webkit-scrollbar-thumb {
    background: DimGray;
    border-radius: 0px;
}
::-webkit-scrollbar-thumb:hover {
    background: DarkGray;
}
.col.right:before {
  content: "";
  white-space: pre-wrap;
  display: block;
  height: 40px;
  background-image: url("https://64.media.tumblr.com/82883a2ce6f43b921c457a014b444c72/d56342f0990d995b-dd/s500x750/136dd8928b107a8501bcb9571018eb986c5a54f5.gif");
  background-repeat: no-repeat;
  background-position-x: center;
  background-size: 550px;
  border-radius: 10px;
}
.mood:after {
  content: "";
  white-space: pre-wrap;
  display: block;
  height: 40px;
  background-image: url(https://64.media.tumblr.com/7c0690311dfb397f61ed4ca4ecd6574a/74e9fc14723ec355-c1/s500x750/b3031bd8aeecd3020086f5da45204b3f4daa90bf.gif);
  background-repeat: no-repeat;
  background-position-x: center;
  background-size: 200px;
  border-radius: 10px;
}
.contact:after {
  content: "";
  white-space: pre-wrap;
  display: block;
  height: 80px;
  background-image: url(https://64.media.tumblr.com/fce2721c84bd312a77b35253d2c3af6b/58a72e02830339d0-9b/s250x400/0efbb601525c08d8b992030fd4ab8335ac7898e3.gif);
  background-repeat: no-repeat;
  background-position-x: center;
  background-size: 200px;
  border-radius: 10px;
}
@keyframes type{
  0%{
    width:0ch;
  }
  100%{
    width:37ch;
  }
}
@keyframes blink{
  0%{opacity:1;}
  50%{opacity:0;}
  100%{opacity:1;}
}
body::before {
content: " ";
display: block;
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: linear-gradient(rgb(141 141 141 / 48%) 50%, rgb(0 0 0 / 0%) 50%);
z-index: 5;
background-size: 100% 2px, 3px 100%;
pointer-events: none;
}
.col, main, footer, nav::before, .online, nav .links, nav .top {
animation: float 4s;
animation-iteration-count: infinite;
animation-timing-function: ease-in-out;
}
@keyframes float {
0% { transform: translate(0, 0px);
}
50% {
transform: translate(0, 8px);
}
100% {
transform: translate(0, -0px);
}
</style>

<img src="https://64.media.tumblr.com/bc0e6c5d9b68eea296319a73cbdf6b21/69e7bded449aa406-c3/s250x400/1fdfda312e5b9b338a8768d5b3e75caf49ca69c1.pnj"/>

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 476 comments ( View all | Add Comment )

Avitin	1772536031 using and thank you Report Comment
Vaegue	1771041227 using Report Comment
X3	1770231265 using Report Comment
isaiah	1770070832 usin Report Comment
_Fr4nk_lol	1768281460 Usando Report Comment
_Fr4nk_lol	1768281459 Usando Report Comment
ANGELSIX	1768195750 Usando 🖤 Report Comment
kamilequa	1767979439 using Report Comment
Sophia	1767769798 using, thanks!!! Report Comment
risha	1767555006 using) thank you! Report Comment
ℭ𝔄𝔎𝔈	1766879274 using! Report Comment
Matias	1766856092 usinggg;) Report Comment
jj	1766272257 usingg Report Comment
St.Anger	1766134388 Using Report Comment
𝑏𝑢𝑛𝑛𝑖𝑒	1766086847 love thiss Report Comment
Jho	1765549342 using! Report Comment
Dahliage	1765512038 this is awesome!! I'm using but had to remove the bouncing as it bothered me, personally Report Comment
huh.damy?	1765320413 usinggg Report Comment
𝔏𝔢𝔫	1765258604 usingg Report Comment
ezekiel	1765221413 usado Report Comment