Witchy Cute

Tags: cute, witchy, witch, goth, spooky, halloween, black, purple

Description:

Cute witchy layout <3. Feel free to customize it if you feel like it :)

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by 𝔞𝔱𝔥𝔞 𝔫𝔬𝔵 ☾ (https://layouts.spacehey.com/layout?id=91713) -->

<style>
        @import url('https://fonts.googleapis.com/css2?family=Creepster&family=Poppins:ital,wght@0,400;0,800;1,400&display=swap');

html:after {
  animation: grain 8s steps(10) infinite;
  background-image: url(https://i.ibb.co/d2Np1d2/static.gif);
  background-size: 200px !important;
  content: '';
  height: 300%;
  left: -50%;
  opacity: .4; /*Change this value (0 - 1) to change the intensity of the effect)*/
  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%) }
}


:root {
--primary-color: #000000; 
  --secondary-color: #ffffff;
    --terciary-color: #B49D78;
}


body{
background-image: url('https://i.pinimg.com/564x/8d/41/e8/8d41e815a356157b64b719d813b085af.jpg');
background-repeat: repeat;
background-position:undefined;
background-attachment: fixed;
background-size: auto;
background-color: var(--primary-color);
}

main{
background-color: var(--primary-color);
border: 3px solid gray;
opacity: 0.8;
  border-radius: 8px;
  line-height: 12px;
  font-size: 12px;
  width: 750px;
}

.contact, .url-info, .table-section, .blurbs, .friends, .comments {
background-color: var(--primary-color);
opacity: 0.8

  
}



nav .top {
background: none;
 font-family: poppins;
width: 750px;}

nav .links{ 
  background: var(--primary-color);
  border-radius: 8px;
  border: 3px solid gray;
  margin: 6px;
  width: 750px;
 

}

.col.w-40.left {
font-family: creepster;
}

.blurbs .inner .section:first-of-type h4{
	color: white;
  font-size: 15px;
}

.blurbs .inner .section:last-of-type h4{
color: white;
    font-size: 15px;
}

}

.profile h1 {
font-family: creepster;
font-size: 50px;
color: rgb(85, 79, 124);
}

h4 {
color: var(--terciary-color);
font-family: creepster;
  font-size: 20px;
  
}



.section h4, .details-table td:first-child {
color: white;
font-family: creepster;
    
}

a, .count {
color: var(--secondary-color);
font-family: Monospace;
}

a:hover {
color: var(--primary-color);
font-family: Sans-Serif;
}

body,main {
color: var(--secondary-color);
font-family: poppins;
}

.details-table td, .details-table td:first-child{
background: none!important;
  border: none;

}
.heading{
background: none!important;

   
}
.comments-table td{
background: none!important;
    border: none;
}

.profile .contact {
border: none;}

.profile .table-section {

border: solid 2px grey;
border-radius: 8px;}

.profile .url-info {
border: solid 2px grey;
border-radius: 8px;}
}



img {
border-radius: 8px;
}

footer {
width: 750px;
background: none;}




</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 11 of 11 comments ( View all | Add Comment )

brutus	1734965668 using!! tysmmmm Report Comment
AntMajolote	1707869618 using Report Comment
₊˚⊹♡ Daphne23 ♡⊹˚₊	1707187106 Using!!! Tysm for sharing ˚ʚ♡ɞ˚ Report Comment
Donica	1706578403 Usingg Report Comment
꓄ꃅꍟꉓꀎꋪꍟꁅꀤꋪ꒒ꀤꍟ	1705284402 Using :) Report Comment
꓄ꃅꍟꉓꀎꋪꍟꁅꀤꋪ꒒ꀤꍟ	1705284396 Using :) Report Comment
camrii !!	1704800619 using, might change some stuff !! Report Comment
vinny	1704777721 using! Report Comment
Liz	1704137215 Using <3 Report Comment
Estella Havisham <3	1703746480 Using Report Comment
Beabo	1703552760 hi, I might use this and change a couple things. Report Comment