Pink dark forest layout

Tags: halloween, colorful, neon, pink, black, orange, goth, dark, skulls, forest
Description:

PLEASE do not remove the credit to me, it is included in the layout for a reason. I worked very hard on this so I hope you enjoy :) Please do not use as a base without credit either. Note: I had a lot of technical difficulties with spacehey while making this so there are duplicates in the code and it's real messy but it works, and it's pretty, so you'll just have to deal with that 😭 Mobile friendly! Actually created it on mobile bc my laptop broke, looks good on any device!
Preview:

click on the image for a larger preview
Code:

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

<style>
.profile {
  background-color: black;
  color: white;
  border: 1.5px solid #c21588;
  box-shadow: 0px 30px 30px #c21588;
</style>
<style>
img {
filter: sepia(350%) hue-rotate(290deg) saturate(5);
}
body::before {
content: " ";
display: block;
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%);
z-index: 2;
background-size: 100% 2px, 3px 100%;
pointer-events: none;
}
.logo {
filter: sepia(100%) hue-rotate(221deg) saturate(0);

</style>

<marquee>Layout by PumpkinGutz!</marquee>

<style>
.online {
    color: #c21588;
}

.online img {
   content: url("http://www.myspacegens.com/images/online_now/109.gif")
</style>
<style>
nav .top {
    display: block;
    background-color: transparent;
}
nav .links {
    display: block;
    background-color: #c21588;
    font-family: monospace;
    font-weight: 400;
    font-size: 12px;
    text-align: center;
<style></style>
<style></style>
<style>
nav .links li:not(:last-child)::after,
footer .links li:not(:last-child)::after{
    content: "";
<style></style>
<style>
.profile .blurbs .heading, .profile .friends .heading {
    display: block;
    background-color: #ff720d;
    color: white;
}

.profile .blurbs .inner h4 {
    color: #c21588;
    font-weight: 700;
}

.profile .blurbs .inner {
    font-family: monospace;
</style>
<style>
a {
    color: #c21588;
}

a:hover, .count {
    color: #c21588;
    font-style: italic;
    text-decoration: none;
<style></style>
<style>
table.details-table {
    background-color: black;
    border-color: pink;
}

.details-table td {
    background-color: black;
}

.details-table td:first-child {
    background: #c21588;
    border-color: pink;
    color: white;
    font-family: monospace;
    font-size: 11.5px;
    font-weight: 400;
}
.details-table td:first-child a {
   border-color: pink;

</style>
<style>
.profile .table-section {
    background-color: #c21588;
    border-color: pink;
}

.profile .table-section .heading {
    display: block;
    background-color: #ff720d;
<style></style>
<style>
.profile .contact .heading {
    background-color: #ff720d;
    border-color: pink;
}
<style>
.profile .table-section .heading {
    background-color: #ff720d;
    border-color: pink; !important
<style></style>
<style>
profile .url-info, .profile .contact {
    border-color: pink;
<style></style>
<style>
.profile .url-info, .profile .contact {
    border-color: pink;
</style>
<style>
.comments-table td:first-child {
   background-color: #c21588;
   border-color: pink;
}

.comments-table td:first-child a {
    color: floralwhite;
    font-family: 'Lekton';
    font-weight: 400;
    font-size: 12px;
}

.comments-table td {
    background-color: black; 
    font-size: 11px;
}

.comments-table td a {
    color: white;
}

.comment-replies {
    border-color: pink;
}

<style></style>
<style>
table.details-table {
    background-color: black;
    border-color: black;
}

.details-table td {
    background-color: black;
}

.details-table td:first-child {
    background: #c21588;
    border-color: white;
    color: white;
    font-family: monospace;
    font-size: 11.5px;
    font-weight: 400;
}
.details-table td:first-child a {
   border-color: black;
</style>

<style>
.profile .table-section {
    background-color: #000000;
    border-color: black;
}

.profile .table-section .heading {
    display: block;
    background-color: #ff720d;
</style>
<style>
.profile .contact .heading {
    background-color: #ff720d;
    border-color: black;
}
<style>
.profile .table-section .heading {
    background-color: #ff720d;
    border-color: black; !important
</style>
<style>
profile .url-info, .profile .contact {
    border-color: black;
</style>
<style>
.profile .url-info, .profile .contact {
    border-color: black;
</style>
<style>
body {
 margin:0;
 background-image: url("https://www.itl.cat/pngfile/big/13-133710_skull-wallpapers-for-iphone-4-skull-and-crossbones.jpg");
background-attachment: fixed;
</style>
<style>
.profile {
  background-color: black;
  color: white;
  border: 1.5px solid #c21588;
  box-shadow: 0px 30px 30px #c21588;
</style>
<style>
nav .links li:not(:last-child)::after,
footer .links li:not(:last-child)::after{
    content: "";
</style>
<style>
.profile .blurbs .heading, .profile .friends .heading {
    display: block;
    background-color: #ff720d;
    color: white;
}

.profile .blurbs .inner h4 {
    color: #ffcfea;
    font-weight: 700;
}

.profile .blurbs .inner {
    font-family: monospace;
</style>
<style>
.online {
    color: #c21588;
</style>
<style>
nav .top {
    display: block;
    background-color: transparent;
}
nav .links {
    display: block;
    background-color: #ff720d;
    font-family: monospace;
    font-weight: 400;
    font-size: 12px;
    text-align: center;
</style>
<style>
nav .links li:not(:last-child)::after,
footer .links li:not(:last-child)::after{
    content: "";
</style>
<style>.profile .blurbs .heading, .profile .friends .heading {
    display: block;
    background-color: #ff720d;
    color: white;
}

.profile .blurbs .inner h4 {
    color: #c21588;
    font-weight: 700;
}

.profile .blurbs .inner {
    font-family: monospace;
</style>
<style>
a {
    color: #c21588;
}

a:hover, .count {
    color: #c21588;
    font-style: italic;
    text-decoration: none;
</style>
<style>
table.details-table {
    background-color: pink;
    border-color: black;
}
.details-table td {
    background-color: black;
border color: black;
}

.details-table td:first-child {
    background: #c21588;
    border-color: white;
    color: white;
    font-family: monospace;
    font-size: 11.5px;
    font-weight: 400;
}
.details-table td:first-child a {
   border-color: black;
}
.profile .table-section .heading {
    display: block;
    background-color: #ff720d;
<style></style>
<style>
.profile .contact .heading {
    background-color: #ff720d;
    border-color: black;
}
<style>
.profile .table-section .heading {
    background-color: #ff720d;
    border-color: black; !important
</style>
<style>
profile .url-info, .profile .contact {
    border-color: black;
</style>
<style>
.profile .url-info, .profile .contact {
    border-color: black;
</style>
<style>
.comments-table td:first-child {
   background-color: #ffcfea;
   border-color: black;
}

.comments-table td:first-child a {
    color: lightpink;
    font-family: 'Lekton';
    font-weight: 400;
    font-size: 12px;
}

.comments-table td {
    background-color: black; 
    font-size: 11px;
}

.comments-table td a {
    color: white;
}

.comment-replies {
    border-color: black;
}

</style>
<style>

.online{content:url("http://www.myspacegens.com/images/online_now/3.gif");}

</style>

<style>
  
  .logo {
  
  content:url("https://media.discordapp.net/attachments/1083062800752054305/1083085695867953152/batspheylogo.png")
  
  }
  
  </style>
<style>
    .profile-info{
        
    background-image: url('https://cdn.discordapp.com/attachments/1188269006424121424/1189997829633089586/b7c6bae1cf3316f732afcf0f0544e989.jpg?ex=65a032d7&is=658dbdd7&hm=df00c1e29fe305e98328ffbfdaf28bbdc49fe50e6f370e6fe1454257a1874bf4&') !important;
    background-attachment: scroll !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: cover !important;       
    }
</style>
<style>
}
h4{
color: white !important;
 }
.top{
background-color: rgba(82, 69, 58, 0.5) !important;
background-image: url('https://cdn.discordapp.com/attachments/1188269006424121424/1190012559135363193/Screenshot_20231228-1124582.png?ex=65a0408f&is=658dcb8f&hm=d19ba70ff3199cab6c8a6532593d99313bd77a6b94591ee08e20b835e07c0fa0&') !important;
background-attachment: scroll !important;
background-repeat: no-repeat !important;
background-position: center !important;
background-size: cover !important;
border-radius: 12px 12px 12px 12px;
margin: 0px 0px 15px !important;
</style>
<style>

@import url('https://fonts.googleapis.com/css2?family=Bigelow+Rules&display=swap');
p{
    font-family: 'Bigelow Rules', cursive;
    font-size: 150%;
    color: rgb(240, 180, 225);

}
h1,h2,h3,h4,h5{
    
    font-family: 'Bigelow Rules', cursive;
    font-size: 150%;
    color: rgb(214, 156, 200);

</style>
<style>
footer {
    text-align: center;
    font-size: 70%;
    margin: 10px 0 10px;
    padding: 10px 5px;
    background: url(https://cdn.discordapp.com/attachments/1188269006424121424/1189997830337740880/38f5ab9a3b80d221f11889e85622f16f.jpg?ex=65a032d7&is=658dbdd7&hm=816845031edab41bd2d19229087fac0c840f081bf889b373798d185befa24bbc&) #59001ea6;
    background-size: auto;
    background-position: center;
    background-blend-mode: soft-light;
}
</style>
<div style="float:  ; max-height: 800px; position: fixed; right: 0px; bottom: 0px; z-index: 200;"><img src="https://external-media.spacehey.net/media/sU-4eeMwgIzYQ7D_cfyWMxumZpgYo_-Krmd6UWzLjZzU=/https://64.media.tumblr.com/8e66b0adc87b2b6e26330f8646523718/450d084a1bfc6d2b-cb/s75x75_c1/df0cdba259e99c9be537c1d1e2ee1aef6a636617.gifv" width="200" height="250"/></div>

<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>

<style>
@keyframes spin{
  from{ transform:rotate(0deg); }
  to{ transform:rotate(-360deg); }
}
.general-about .profile-pic img{
  border-radius: 50%;
  animation: spin 7s infinite linear;
}
</style>
<style>
.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: "🎃"
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
	/* Add to Favorites */
	content: "🎃"
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
	/* Send Message */
	content: "🎃"
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
	/* Forward to Friend */
	content: "🎃"
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
	/* Instant Message */
	content: "🎃"
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
	/* Block User */
	content: "🎃"
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
	/* Add to Group */
	content: "🎃"
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
	/* Report Profile */
	content: "🎃"
}
</style>

<style>
main:before {
	width: 100%;
	height: 300px;
	display: block;
	content: "";
	background-image: url('https://cdn.discordapp.com/attachments/1188269006424121424/1189997829993811978/Screenshot_20231228-112100.png?ex=65a032d7&is=658dbdd7&hm=6584a4699a003a355444cad7c43b83a249a76d7c915ec631dc2b2666e2385da9&');
	background-position: center center;
	background-size: cover;
}
@media only screen and (max-width: 600px) {
	main:before{
		height: 200px;
	}
}
</style>
<div class="snowflakes">
  <div class="snowflake">
   <img src="https://external-media.spacehey.net/media/sdEkicJFPIV4gSR1se5gVIq76rLmKtnP2HayWNqJ-xNI=/http://dl2.glitter-graphics.net/pub/50/50342lnxn0mrluv.gif"/>
  </div>
  <div class="snowflake">
  <img src="https://external-media.spacehey.net/media/sdEkicJFPIV4gSR1se5gVIq76rLmKtnP2HayWNqJ-xNI=/http://dl2.glitter-graphics.net/pub/50/50342lnxn0mrluv.gif"/>
  </div>
  <div class="snowflake">
  <img src="https://external-media.spacehey.net/media/sdEkicJFPIV4gSR1se5gVIq76rLmKtnP2HayWNqJ-xNI=/http://dl2.glitter-graphics.net/pub/50/50342lnxn0mrluv.gif"/>
  </div>
  <div class="snowflake">
  <img src="https://external-media.spacehey.net/media/sdEkicJFPIV4gSR1se5gVIq76rLmKtnP2HayWNqJ-xNI=/http://dl2.glitter-graphics.net/pub/50/50342lnxn0mrluv.gif"/>
  </div>
  <div class="snowflake">
  <img src="https://external-media.spacehey.net/media/sdEkicJFPIV4gSR1se5gVIq76rLmKtnP2HayWNqJ-xNI=/http://dl2.glitter-graphics.net/pub/50/50342lnxn0mrluv.gif"/>
  </div>
  <div class="snowflake">
  <img src="https://external-media.spacehey.net/media/sdEkicJFPIV4gSR1se5gVIq76rLmKtnP2HayWNqJ-xNI=/http://dl2.glitter-graphics.net/pub/50/50342lnxn0mrluv.gif"/>
  </div>
  <div class="snowflake">
    <img src="https://external-media.spacehey.net/media/sdEkicJFPIV4gSR1se5gVIq76rLmKtnP2HayWNqJ-xNI=/http://dl2.glitter-graphics.net/pub/50/50342lnxn0mrluv.gif"/>
  </div>
  <div class="snowflake">
    <img src="https://external-media.spacehey.net/media/sdEkicJFPIV4gSR1se5gVIq76rLmKtnP2HayWNqJ-xNI=/http://dl2.glitter-graphics.net/pub/50/50342lnxn0mrluv.gif"/>
  </div>
  <div class="snowflake">
     <img src="https://external-media.spacehey.net/media/sdEkicJFPIV4gSR1se5gVIq76rLmKtnP2HayWNqJ-xNI=/http://dl2.glitter-graphics.net/pub/50/50342lnxn0mrluv.gif"/>
  </div>
  <div class="snowflake">
    <img src="https://external-media.spacehey.net/media/sdEkicJFPIV4gSR1se5gVIq76rLmKtnP2HayWNqJ-xNI=/http://dl2.glitter-graphics.net/pub/50/50342lnxn0mrluv.gif"/>
  </div>
  <div class="snowflake">
    <img src="https://external-media.spacehey.net/media/sdEkicJFPIV4gSR1se5gVIq76rLmKtnP2HayWNqJ-xNI=/http://dl2.glitter-graphics.net/pub/50/50342lnxn0mrluv.gif"/>
  </div>
  <div class="snowflake">
    <img src="https://external-media.spacehey.net/media/sdEkicJFPIV4gSR1se5gVIq76rLmKtnP2HayWNqJ-xNI=/http://dl2.glitter-graphics.net/pub/50/50342lnxn0mrluv.gif"/>
  </div>
</div>
<style>
/* customizable snowflake styling */
.snowflake {
  color: #27cff5;
  font-size: 2em;
  font-family: Arial, sans-serif;
  text-shadow: 0 0 0px rgba(0,0,0,0.7);
}

@-webkit-keyframes snowflakes-fall{0%{top:-10%}100%{top:100%}}@-webkit-keyframes snowflakes-shake{0%,100%{-webkit-transform:translateX(0);transform:translateX(0)}50%{-webkit-transform:translateX(80px);transform:translateX(80px)}}@keyframes snowflakes-fall{0%{top:-10%}100%{top:100%}}@keyframes snowflakes-shake{0%,100%{transform:translateX(0)}50%{transform:translateX(80px)}}.snowflake{position:fixed;top:-10%;z-index:9999;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default;-webkit-animation-name:snowflakes-fall,snowflakes-shake;-webkit-animation-duration:10s,3s;-webkit-animation-timing-function:linear,ease-in-out;-webkit-animation-iteration-count:infinite,infinite;-webkit-animation-play-state:running,running;animation-name:snowflakes-fall,snowflakes-shake;animation-duration:10s,3s;animation-timing-function:linear,ease-in-out;animation-iteration-count:infinite,infinite;animation-play-state:running,running}.snowflake:nth-of-type(0){left:1%;-webkit-animation-delay:0s,0s;animation-delay:0s,0s}.snowflake:nth-of-type(1){left:10%;-webkit-animation-delay:1s,1s;animation-delay:1s,1s}.snowflake:nth-of-type(2){left:20%;-webkit-animation-delay:6s,.5s;animation-delay:6s,.5s}.snowflake:nth-of-type(3){left:30%;-webkit-animation-delay:4s,2s;animation-delay:4s,2s}.snowflake:nth-of-type(4){left:40%;-webkit-animation-delay:2s,2s;animation-delay:2s,2s}.snowflake:nth-of-type(5){left:50%;-webkit-animation-delay:8s,3s;animation-delay:8s,3s}.snowflake:nth-of-type(6){left:60%;-webkit-animation-delay:6s,2s;animation-delay:6s,2s}.snowflake:nth-of-type(7){left:70%;-webkit-animation-delay:2.5s,1s;animation-delay:2.5s,1s}.snowflake:nth-of-type(8){left:80%;-webkit-animation-delay:1s,0s;animation-delay:1s,0s}.snowflake:nth-of-type(9){left:90%;-webkit-animation-delay:3s,1.5s;animation-delay:3s,1.5s}.snowflake:nth-of-type(10){left:25%;-webkit-animation-delay:2s,0s;animation-delay:2s,0s}.snowflake:nth-of-type(11){left:65%;-webkit-animation-delay:4s,2.5s;animation-delay:4s,2.5s}
</style>

<style>

table.comments-table{
display: block;
height: 400px!important;
overflow-y: scroll;
}

</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 5 of 5 comments ( View all | Add Comment )
Astro	1709484986 Using Report Comment
B6CKSTAGE	1707372290 Usingggg :) Report Comment
lesboluvrr🫀	1706564060 this is so cool!! using!! Report Comment
sleepyusser	1706231869 using Report Comment
Reb S.D.W (^･ｪ･^)	1705441943 using :3 Report Comment