first layout

Tags: layout, dark, goth, pink, emo, lace

Description:

my own base layout + a bunch of gifs and stuff made by other people whos names are in the code. beware this is very ugly and i did not know what i was doing but alas here we are

Preview:

click on the image for a larger preview

Code:

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

<style>

@import url('https://fonts.googleapis.com/css2?family=UnifrakturMaguntia&display=swap');
}

button, input {
    overflow: visible;
    background-color: #954D70;
    opacity: 90%;
    border-style: dotted;
    border-color: black;
    border-width: 2px;
    margin: 5px 0px 0px 0px;
}

button, [type="button"], [type="reset"], [type="submit"] {
    -webkit-appearance: button;
    background-color: ;
    border-style: full;
    border-color: black;
    border-width: 2px;
    margin: 5px 0px 0px 0px;
    color: black;
}

.comment-replies {
    padding: 0 5px;
    border: 1.8px dashed #fff;
    margin-top: 1px;
}

table {
    border-top-color: rgb(0, 0, 0);
    border-right-color: rgb(0, 0, 0);
    border-bottom-color: rgb(0, 0, 0);
    border-left-color: rgb(0, 0, 0);
font-family: times new roman, cursive;
}

.comments-table td:first-child, .music-table td:first-child {
    background: #954D70;
    background: fff;
    text-align: left;
    font-weight: light;
    width: 30%;
font-family: times new roman, cursive;
}

.comments-table td, .music-table td {
    background: #954D70;
    background: #954D70;
    vertical-align: top;
font-family: times new roman, cursive;
}

.comment-replies {
    padding: 0 5px;
    border: 2px solid black;
    margin-top: 1px;
font-family: times new roman, cursive;
}

body::before {
    content: " ";
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    opacity: 0.5;
    z-index: 2;
background-size: cover;
    pointer-events: none;
    mix-blend-mode: color-dodge;
}

.container {
    width: 1100px;
    border: 2px solid black;
    max-width: 100%;
    margin: 0 auto 10px;
    padding: 9px 0px 0px 0px;
font-family: times new roman, cursive;
}

body{
    background: url(https://i.pinimg.com/564x/92/b6/1f/92b61fda75a688c7cd943ab9e96819f0.jpg); no-repeat fixed; background-size: 400px;
}

nav .top{
margin-top: 10px;
background: url(https://i.pinimg.com/564x/29/2f/81/292f81b3055e3c0cb94de1adc381ad9e.jpg);
    background-size: cover;
    background-position-y: 210px;
    border: 1px black;
    border-radius: 5px;
    box-shadow: 0 0 8px black;
    opacity: 80%;
    filter: hue-rotate(17deg) brightness(1.5);
}

nav .links .special a {
    color: #ff0000;
}

nav .links li:not(:last-child)::after, links li:not(:last-child)::after {
    content: " ♠ ";
    color: black;
}

nav .links{
background: transparent;
text-align: center;
}

nav{
background: url(https://i.pinimg.com/564x/29/2f/81/292f81b3055e3c0cb94de1adc381ad9e.jpg);
    margin-top: 20px;
    margin-bottom: 15px;
    border: 3px solid black;
    filter: contrast(0.8) saturate(0.5) brightness(0.9);
    box-shadow: inset 3px 3px grey, inset -3px -3px #a5a5a5, 7px 6px 7px #0000008f;
}

main{
 background: #954D70;
    opacity: 87%;
    color: black;
    padding: 6px 0px;
    font-size: 100%;
    border-style: dotted;
    border-width: 2px 2px 2px 2px;
    border-color: black;
font-family: times new roman, cursive;   


}

.edit-link {
    font-size: 90%;
    text-align: center;
}

main a {
     color: black;
text-shadow: 0 0 2px black;
font-family: times new roman, cursive;
font-size: 50px
line-height: 50px;
}

a:hover, a:active, .blog-entry .kudos-btn:hover, .blog-entry .kudos-btn:active {
    color: black;
    text-decoration: underline;
}

.profile .contact .heading, .profile .table-section .heading, .profile .blurbs .heading h4, .profile .friends .heading h4, .setting-section .heading, .home-actions .heading {
    color: #954d70;
    background: black;
font-family: UnifrakturMaguntia;
}

.profile .url-info{
 display:none;
}

.details-table td:first-child, .comments-table td:first-child, .music-table td:first-child {
 background-color: #954D70;
    background-color: var(--pink); 
    vertical-align: top;
    border-style: solid;
    border-width: 0,5px;
font-family: times new roman, cursive;
}

.details-table td, .comments-table td, .music-table td {
 background-color: #954D70;
    background-color: var(--pink); 
    vertical-align: top;
    border-style: solid;
    border-width: 0,5px;
font-family: times new roman, cursive;
}

main:before {
        background-image: url('http://www.geocities.ws/pict7_1/gothic/gothic_angel.gif');
        margin-left: 600px;
        background-size: 250px;
        background-repeat: no-repeat;
        color: transparent!important;
        display: block;
        content: "";
        width:;
        height: 300px;
        margin-bottom: -29px;
        margin-top: -5px;
}

.profile-info {
background: url(
https://i.pinimg.com/736x/5e/9c/20/5e9c20b31abfc736a590ec5e86413378.jpg);
    background-position-y: -104px;
    height: 120px;
    border: 3px solid black;
    background-size: cover;
 }

h1 {      
  font-size:68px!important;
        font-family: UnifrakturMaguntia;
        font-weight: 200;
 -webkit-text-stroke-width: 1px;
        -webkit-text-stroke-color: black;
 font-style: ;
        text-decoration: line-through;
        text-align: left;
        line-height: 55px!important;
        display: block;
        color: black;
        padding: 10px;   transform: ;
        margin-top: -260px!important;
        margin-bottom: px!important;
}

.profile-info .inner{ background: transparent; }

.profile .blurbs .heading, .profile .friends .heading {
    color: #954d70;
    background: black;
font-family: UnifrakturMaguntia;
text-align: center;
}

.profile .blurbs .section h4 {
    color: #954d70;
    background: black;
font-family: UnifrakturMaguntia;
text-align: center;
}

.count {
    color: #FADBD8;
}

.friends-grid a {
    background: none;
}

.profile .friends .person p {
    color: black;
    font-weight: bold;
    width: 100%;
    overflow-wrap: break-word;
    word-break: break-word;
    font-size: 100%;
    text-align: center;
}

.online{
content:url("https://gifs.carrd.co/assets/images/image31.gif?vfd74bc7cc");
}

}

footer {
    border: 2px solid black;
    text-align: center;
    font-size: 70%;
    margin: 10px 0 10px;
    padding: 10px 5px;
    background-color: #954d70;
font-family: times new roman, cursive;
}

footer a {
    color: #954d70;
}

:root {
    --logo-blue: ;
    --darker-blue: white;
    --lighter-blue: black;
    --even-lighter-blue: #954D70;
    --lightest-blue: #954D70;
    --dark-orange: black;
    --light-orange: black;
    --even-lighter-orange: red;
    --accent-color: red;
font-family: times new roman, cursive;
}

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

.profile .mood {
    width: 100%;
    display: inline-block;
    margin-bottom: 26px;
}

.general-about img {
-webkit-mask-image: url( https://i.postimg.cc/4N5mdGFw/842-sin-t-tulo-20240413155316.png);
-webkit-mask-size: 100%;
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center;}
}

.profile .friends .person img:not(.icon) { 
-webkit-mask-image: url(https://i.postimg.cc/4N5mdGFw/842-sin-t-tulo-20240413155316.png );
-webkit-mask-size: 100%;
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center;}

}
.comments-table td:first-child img:not(.icon) { 
-webkit-mask-image: url(https://i.postimg.cc/4N5mdGFw/842-sin-t-tulo-20240413155316.png);
-webkit-mask-size: 100%;
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center;}
}

html:before{
	content: " ";
	height: 100vh;
	width: 100vw;
	display: block;
	position: fixed; 
	top: 0; 
	left: 0; 
	z-index: 100;
	background-image: url(https://i.pinimg.com/originals/f1/dd/12/f1dd12a61da24561ac5997c8308ab37e.gif);
	background-size: cover;
        background-position:center;
        background-color: black;
	animation: yourAnimation 1s ease 1s normal forwards;
	pointer-events: none}

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


<!-- (c) Layout created by イザベラ (https://layouts.spacehey.com/layout?id=101359) -->

<img src="https://64.media.tumblr.com/ea24db791b812a6b801a0e2a7a5aa7c4/54342fb5ebe553f2-48/s1280x1920/d9c665414c4514737cb30edc0d7aa72e8dfc38f8.gifv"/>

<img src="https://64.media.tumblr.com/0a247c8ea6e58c746460ebeedb9f02cd/54342fb5ebe553f2-6c/s540x810/0647a635b0b33dfd9b6bcc1a6972ec1dd8f32a37.gifv"/>

<img src="https://64.media.tumblr.com/93495eaaa52b4b5a788e5b952a327a94/54342fb5ebe553f2-11/s500x750/b260af9619e68f4db4d6252b43a4fbd836e49f28.gifv"/>

<img src="https://64.media.tumblr.com/3456bff9f68b7755d3dc76655d82100a/54342fb5ebe553f2-37/s500x750/f327155ed28fd5565e0efffd58146b3bfb530b84.gifv"/>

<img src="https://64.media.tumblr.com/a5289e6bd20ee8e1ee3075d71bcfa1b2/54342fb5ebe553f2-85/s1280x1920/5b28e160d61330bb8f11b7a2ca0ba35c52545e0d.pnj"/>

<img src="https://64.media.tumblr.com/4c9bfaf851a65841c0fc1e622a534fdb/54342fb5ebe553f2-36/s500x750/73c66135cb33684ac37da849a8a66f53aed3fd68.gifv"/>

<img src="https://64.media.tumblr.com/9edea2c199faec930bec245c544863c5/54342fb5ebe553f2-41/s500x750/f98877e7cce59c3aa8496e66d854d628b23872dd.gifv"/>

<img src="https://64.media.tumblr.com/53a8877bad65ed0b977fa0409092dec4/54342fb5ebe553f2-7a/s500x750/c29b62c4b742c04054dc1861b98834579560a134.gifv"/>

<img src="https://64.media.tumblr.com/082f6b2e499b7b6dbbdec8a080fecf3b/54342fb5ebe553f2-39/s640x960/50b005a4448695ec4567769c5130e4d6efd4a59e.gifv"/>

<img src="https://64.media.tumblr.com/d3963116f8a912aea6a06d1587a54ddc/54342fb5ebe553f2-7d/s400x600/7444bf01fe143d45b9e26e5afb31fd07672b0a8c.gifv"/>

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

<img src="https://collection.ju.mp/assets/images/gallery18/1c96020a_original.png?v=0236594d"/>

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

<div style="float:  ; max-height: 200px; position: fixed; left: 25px; top: 6px; z-index: 300;">
<img src="https://notmerlin.com/other/horrorgifs/gifs/Skeleton/Skeleton%20(75).gif" height="290"/>

<div style="float:  ; max-height: 200px; position: fixed; right: 5px; top: 1px; z-index: 200;">
<img src="https://64.media.tumblr.com/23d9c4bd4cc519804bfab3930fcae23f/6f8a043a4b90505a-4a/s400x600/7295563c47964a8e87dc101ed19ad6da3aa4611e.pnj" height="230"/>


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

<style>
li.active .icon { content:url('https://i.ibb.co/vLLVfDx/error-um-amor-bugado-fotor-bg-remover-20231028224327.png'); width: 20PX;height: 20px;}
</style>

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


<div style="float:  ; max-height: 800px; position: fixed; right: 1px; bottom: 10px; z-index: 200;"><img src="https://notmerlin.com/other/horrorgifs/gifs/Fire/Fire%20(9).gif"/>
</div>

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


<div style="float:  ; max-height: 800px; position: fixed; left: 1px; bottom: 10px; z-index: 200;"><img src="https://notmerlin.com/other/horrorgifs/gifs/Fire/Fire%20(9).gif"/>
</div>

<!-- (c) Layout created by ☁️ ˗ˋ Nero ˊ˗ 🦴 !! ᐢ..ᐢ ꒱ ‧₊˚ (https://layouts.spacehey.com/layout?id=103538) -->

<style>

.general-about img {-webkit-mask-image: url( https://i.postimg.cc/4N5mdGFw/842-sin-t-tulo-20240413155316.png);-webkit-mask-size: 100%;-webkit-mask-repeat: no-repeat;-webkit-mask-position: center;}

</style>



<style>

.profile .friends .person img:not(.icon) { -webkit-mask-image: url(https://i.postimg.cc/4N5mdGFw/842-sin-t-tulo-20240413155316.png );-webkit-mask-size: 100%;-webkit-mask-repeat: no-repeat;-webkit-mask-position: center;}

</style>

<style>



.comments-table td:first-child img:not(.icon) { -webkit-mask-image: url(https://i.postimg.cc/4N5mdGFw/842-sin-t-tulo-20240413155316.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 20 of 134 comments ( View all | Add Comment )

❁katzy❁ｚＺ	11 hours ago USING OML I PANICKED BC I USED IT AND THEN I COULDNT FIND THE LAYOUT AGAIN TO COMMENT Report Comment
letovaa	21 hours ago using!! Report Comment
Snowberry	2 days ago USING!!!!! :P Report Comment
K1TKAT	2 days ago USINGGGGG Report Comment
Thobeeiy	2 days ago using!! Report Comment
seventortures	4 days ago looks neat, using Report Comment
Britney	15 days ago Using! Report Comment
_girltorture	15 days ago using :) Report Comment
Mia	15 days ago using Report Comment
Beadb	16 days ago Using Report Comment
tinnasmoonS2	16 days ago USING Report Comment
Alǐx	19 days ago Using Report Comment
Alǐx	19 days ago Using Report Comment
Raine	20 days ago using Report Comment
Raine	20 days ago using Report Comment
deadly.bec	23 days ago using Report Comment
Key𖣂ꨄ	23 days ago using Report Comment
J-u-n-o	25 days ago using!!!! Report Comment
goul	25 days ago using ! Report Comment
queerm4rtyr	26 days ago using!!! and i hope you dont mind if i change a few things :) Report Comment