Black and Grey Layout

Tags: purple, grey, black, layout, autoplay, music, witchy, whimsigoth

Description:

Comment if you use this. Pretty basic black & grey layout with some purple. Contains autoplay music aswell.

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by natasza 𝜗𝜚 (https://layouts.spacehey.com/layout?id=99071) -->

<style>

:root {

        --logo-blue: #(706f6f);

        --darker-blue: #(9e251c);

        --lighter-blue: black;

        --even-lighter-blue: grey;

        --lightest-blue: transparent;

        --dark-orange: white;

        --light-orange: linear-gradient(grey, #36275B);

        --even-lighter-orange: black;

        --green: transparent;
    }




body

        {background-color: grey; no-repeat fixed; background-size:cover;

}

main {

  background-color: black;

  color: white;

.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: "🕸"

}

.row.profile{
box-shadow: 0px 0px 10px 6px #463572;
}
}

.general-about .profile-pic img {
border: 2px solid #36275B;

box-shadow: 0px 0px 10px 0px #36275B;
 }   

.profile .friends .inner{
    text-align: center;
background-image: url("");
border: 2px inset #36275B;
box-shadow: 0px 0px 10px 0px #36275B;
background-position: center;
}

.online { visibility: hidden; } .online img { content: url("http://dl2.glitter-graphics.net/pub/341/341842q4vbfz1x40.gif"); animation-name: none; visibility: visible; height: 43px; width: 90px; }

</style>

<style>

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

</style>


<style>* {cursor: url(https://ani.cursors-4u.net/cursors/cur-13/cur1163.ani), url(https://ani.cursors-4u.net/cursors/cur-13/cur1163.ani), auto !important;}</style>

<style>
html:after {
  animation: grain 8s steps(10) infinite;
  background-image: url(https://s.studiobinder.com/wp-content/uploads/2020/08/What-is-Film-Grain-Film-Grain-Example.jpg);
  content: "";
  height: 300%;
  left: -50%;
  opacity:.1;
  position: fixed;
  top: -110%;
  width: 300%;
  pointer-events:none;
}
@keyframes grain {
  0%, 100% { transform:translate(0, 0) }
  10% { transform:translate(-5%, -10%) }
  20% { transform:translate(-15%, 5%) }
  30% { transform:translate(7%, -25%) }
  40% { transform:translate(-5%, 25%) }
  50% { transform:translate(-15%, 10%) }
  60% { transform:translate(15%, 0%) }
  70% { transform:translate(0%, 15%) }
  80% { transform:translate(3%, 35%) }
  90% { transform:translate(-10%, 10%) }
}
</style>



<iframe width="0" height="0" src="https://www.youtube.com/embed/ZdbZBu3wwtM?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.

Comments

Displaying 20 of 119 comments ( View all | Add Comment )

Grey	23 days ago Usingg Report Comment
﹒ @bloopzy ﹕☆	25 days ago usingg! :P Report Comment
Sara	1 month ago Using!! Report Comment
pip! (・・;)ゞ	1 month ago using! Report Comment
julyyy	1 month ago Using Report Comment
kael	1 month ago usinggg! >_< Report Comment
✯ vinceent thee maniaac ✯	1 month ago TYSMM!!! Report Comment
eeirai	1 month ago using!! :3 Report Comment
A	2 months ago Usiinngg Report Comment
𓆣 𝙲𝙹 𓆣	2 months ago using! Report Comment
jalissa	2 months ago usingg! Report Comment
poetartte	3 months ago using!!! THANNKS 🩷 Report Comment
Stevie ☆	3 months ago using! Report Comment
Lucy :)	3 months ago using!! Report Comment
tomy	3 months ago usingg Report Comment
anya	3 months ago using Report Comment
y2k_Stella☆	3 months ago using Report Comment
Ethan	3 months ago Usingg ^^ Report Comment
Ethan	3 months ago Usingg ^^ Report Comment
Sin	4 months ago using <3 Report Comment