Dark Red Layout

Tags: red, black, simple, layout

Description:

I have no better name for it lol-
1. The layout comes with a cross for the pfp shape. If it makes your pfp look weird feel free to take it off.
2. Feel free to change anything or use this as a base, I don't mind.
3. Please comment if you use this :D

Preview:

click on the image for a larger preview

Code:

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

<div class="rose"></div>
<div class="sucker"></div>
<img src="https://i.pinimg.com/originals/dd/dc/4a/dddc4a151152faf2cb5030645fb69486.gif" height="200px" width="200px"/>

<style>
@import url('https://fonts.googleapis.com/css2?family=Special+Elite&display=swap');
p{
  font-family: 'Special Elite', cursive;
  font-size: 110%;
  color: white 
}
h1,h2,h3,h4,h5{
  font-family: 'Special Elite', cursive;
  font-size: 120%;  
}

h1 {
  color: #950811;
  text-shadow: 1px 1px 2px #000000;, 0 0 25px black, 0 0 5px black;
}
h4 {
  color: #950811;
  text-shadow: 1px 1px 2px #000000;, 0 0 25px black, 0 0 5px black;
}
  body {
   background-image: url(https://i.pinimg.com/564x/13/2e/47/132e47e54096a395819ac567d8a2b15d.jpg);
background-size: cover;
height: 100%;
background-attachment: fixed;

}
button, input {
    overflow: visible;
    border: 1px solid #000000;
    background: #7c060f;
    color: white;
    font-family: 'Special Elite', cursive;
}
main{
background: rgba(0, 0, 0, 0) !important;
}
.profile {
   background-color: rgba(0, 0, 0, 0.5); 
} 
.container {
   width: 790px;
}
.profile .profile-info{
color: black; 
background-image: url(https://i.pinimg.com/564x/b9/24/69/b924697f79ed35173b63ffc6838cca50.jpg);
background-size: cover;
background-position: center;
}
.general-about .profile-pic img{
clip-path: polygon(10% 25%, 35% 25%, 35% 0%, 65% 0%, 65% 25%, 90% 25%, 90% 50%, 65% 50%, 65% 100%, 35% 100%, 35% 50%, 10% 50%);
}
.profile .friends .person img {
clip-path: polygon(10% 25%, 35% 25%, 35% 0%, 65% 0%, 65% 25%, 90% 25%, 90% 50%, 65% 50%, 65% 100%, 35% 100%, 35% 50%, 10% 50%);
}
.comments-table img,
.person img{
clip-path: polygon(10% 25%, 35% 25%, 35% 0%, 65% 0%, 65% 25%, 90% 25%, 90% 50%, 65% 50%, 65% 100%, 35% 100%, 35% 50%, 10% 50%);
}
  .url-info{
    display:none !important;
  }
nav .links li:not(:last-child)::after, footer .links li:not(:last-child)::after {
    content: "🩸";
    color: white;
}
nav .top {
color: white;
font-family: 'Special Elite', cursive;
}
/* change all headings on page to different colors. */
  .profile .blurbs .heading,
  .profile .friends .heading{
   background-color: rgb(0,0,0);
   color: white;
}
/* change all headings on page to different colors. */
  .profile .contact .heading,
  .profile .table-section .heading{
   background-color: black;
   color: white;
}

footer {
    border-radius: 15px;
    background-image: url(https://i.pinimg.com/564x/2f/43/64/2f43645123bddbe6851d734fe21c73b7.jpg);
    color: white;
}

table.comments-table td {
    color: rgb(255, 77, 166);
}

:root {
    --logo-blue:black;
    --darker-blue: white;
    --lighter-blue: black;
    --even-lighter-blue: ;
    --lightest-blue: ;
    --dark-orange: white;
    --light-orange: black;
    --even-lighter-orange: black;
    --green: pink;
}
.online{
color: #950811;
font-family: 'Special Elite', cursive;
font-size: 19px;
text-align: left;
}

.online img{
content: url(https://dl.glitter-graphics.com/pub/203/203780ktcamud2d3.gif );
}
nav .links a:hover{
text-decoration: line-through;
color: #620307;
}

a:hover {
color: #620307;
}

.count{
color: #960710;
}
.profile .friends-grid .person p{
color: #960710;
}
nav .links{
background-color: #7c060f;
font-family: 'Special Elite', cursive;
font-size: 80%;
}
nav .links .special a {
    color: #ffffff;
}

::selection {
   background: #950811;
   color: #FFFFFF
}
.logo {
   content: url(https://media.discordapp.net/attachments/1018753164020813906/1116267612142325870/2023_06_08_05s_Kleki.png?width=315&height=80);
}
.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 .contact {
    border-radius: 10px;
    border:2px solid rgba(0, 0, 0, 0);
    background-image: url(https://i.pinimg.com/564x/47/59/f1/4759f193d4605528195841e0bf4b1985.jpg);
    background-position: right top;
    background-repeat: repeat;
    background-attachment: scroll;
    Height:140px;
    color: white;
    text-shadow: 1px 1px 2px black
  }
  body:before {
    content: " ";
    height: 100vh;
    width: 100vw;
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
    background-image: url('https://media3.giphy.com/media/PpSHFt33Mr9jW/giphy.gif');
    background-size: cover;
    background-repeat: no-repeat;
    animation: yourAnimation 4s ease 0s 1 normal forwards;
    pointer-events: none;
  }
  @keyframes yourAnimation { 0.0%{ opacity: 1;} 75%{ opacity: 1; } 100%{ opacity: 0;} }
}
</style>

<style>

div.rose {
    background: url(https://media.discordapp.net/attachments/1018753164020813906/1116432076556751009/952f933865be73aef6f2374e555bff9e-removebg-preview.png?width=418&height=418);
    background-size: 100%!important;
    position: fixed;
    right: -100px;
    top: 100px;
    height: 320px;
    width: 320px;
    opacity: 100%;
}

div.sucker {
    background: url(https://media.discordapp.net/attachments/1018753164020813906/1116428422281953321/4c348e4b09911c0422cdddcb6c2bb4fd-removebg-preview.png?width=418&height=418);
    background-size: 100%!important;
    position: fixed;
    left: -100px;
    bottom: 10px;
    height: 400px;
    width: 400px;
    opacity: 100%;
}
</style>

<style>* {cursor: url(https://cur.cursors-4u.net/nature/nat-8/nat791.cur), auto !important;}</style><a href="https://www.cursors-4u.com/cursor/2009/09/20/flower-54.html" target="_blank" title="Red Rose"><img src="https://cur.cursors-4u.net/cursor.png" alt="Red Rose" style="position:absolute; top: 0px; right: 0px;"/></a>

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

Nikiwy	1786642472 yo, i have an issue, how can i put text in the layout that keeps the font? Report Comment
Syoopi	1778610138 Using! Report Comment
Jesse!! (Pfp: milesiscozy)	1773322208 Using ! Report Comment
action kat ⚞ • ⚟	1771178835 using !! ^⁠_⁠^ Report Comment
C0L3	1768547137 using!! Report Comment
Bella	1763765882 usingg Report Comment
Amara🇧🇷	1758137176 usinng Report Comment
mercedes	1749693094 using! Report Comment
Wangxian	1749504407 usingg Report Comment
nannica	1747675110 usinggg ^^ Report Comment
Jasper	1747314393 using ^_^ Report Comment
Ice	1744503405 using Report Comment
𝓜𝓪𝓳𝓸	1740189212 Using 💋 Report Comment
★°♪K1TTI3♪°★	1739653596 using Report Comment
Juuso	1737897961 Using :) Report Comment
Mike	1727453150 hii, using Report Comment
Y00_Ly00	1723731193 using!!^^ Report Comment
Woah.	1721897482 Using !! :3 Report Comment
Jasper	1721487076 Using!! Report Comment
SCENECORE JASON!<3	1714083668 using probably! <3 Report Comment