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

IAN	1774541206 using! Report Comment
lcvelymar	1774509284 usingg!! Report Comment
Deetta	1774468392 usingg Report Comment
GhostXD	1774357835 using!! Report Comment
werewolf	1774129854 using Report Comment
✩‧₊˚Lilihimitsu ✩‧₊˚	1773804069 using! Report Comment
Rinascita	1773509497 Using Report Comment
wxnnerf	1773428574 using Report Comment
necro	1773337705 using tytyty Report Comment
NORTH	1773328259 using Report 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