B&W Harley Quinn themed layout

Tags: #harleyquinn, #black, #white

Description:

This is my first time creating a layout which I'm proud of, do feel free to change anything to your liking. Please give creds <3 I also accept friend reqs and suggestions.

Preview:

click on the image for a larger preview

Code:

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

<marquee behavior="scroll" direction="down" style="position:absolute; left:53%; top:46px; width:20; height:525px;"><font color="#330033" size="+2">♦</font></marquee>
<marquee behavior="scroll" direction="down" style="position:absolute; left:18%; top:168px; width:20; height:626px;"><font color="#330033" size="+2">♦</font></marquee>
<marquee behavior="scroll" direction="down" style="position:absolute; left:22%; top:62px; width:20; height:517px;"><font color="#330033" size="+2">♦</font></marquee>
<marquee behavior="scroll" direction="down" style="position:absolute; left:45%; top:4px; width:20; height:569px;"><font color="#330033" size="+2">♦</font></marquee>
<marquee behavior="scroll" direction="down" style="position:absolute; left:8%; top:131px; width:20; height:615px;"><font color="#330033" size="+2">♦</font></marquee>
<marquee behavior="scroll" direction="down" style="position:absolute; left:6%; top:144px; width:20; height:589px;"><font color="#330033" size="+2">♦</font></marquee>
<marquee behavior="scroll" direction="down" style="position:absolute; left:13%; top:4px; width:20; height:529px;"><font color="#330033" size="+2">♦</font></marquee>
<marquee behavior="scroll" direction="down" style="position:absolute; left:50%; top:158px; width:20; height:663px;"><font color="#330033" size="+2">♦</font></marquee>
<marquee behavior="scroll" direction="down" style="position:absolute; left:32%; top:72px; width:20; height:511px;"><font color="#330033" size="+2">♦</font></marquee>
<marquee behavior="scroll" direction="down" style="position:absolute; left:51%; top:35px; width:20; height:684px;"><font color="#330033" size="+2">♦</font></marquee>
<marquee behavior="scroll" direction="down" style="position:absolute; left:9%; top:178px; width:20; height:516px;"><font color="#330033" size="+2">♦</font></marquee>
<marquee behavior="scroll" direction="down" style="position:absolute; left:49%; top:136px; width:20; height:570px;"><font color="#330033" size="+2">♦</font></marquee>
<marquee behavior="scroll" direction="down" style="position:absolute; left:35%; top:57px; width:20; height:583px;"><font color="#330033" size="+2">♦</font></marquee>
<marquee behavior="scroll" direction="down" style="position:absolute; left:85%; top:1px; width:20; height:565px;"><font color="#330033" size="+2">♦</font></marquee>
<marquee behavior="scroll" direction="down" style="position:absolute; left:45%; top:12px; width:20; height:585px;"><font color="#330033" size="+2">♦</font></marquee>
<marquee behavior="scroll" direction="down" style="position:absolute; left:58%; top:74px; width:20; height:633px;"><font color="#330033" size="+2">♦</font></marquee>
<marquee behavior="scroll" direction="down" style="position:absolute; left:47%; top:23px; width:20; height:636px;"><font color="#330033" size="+2">♦</font></marquee>
<marquee behavior="scroll" direction="down" style="position:absolute; left:7%; top:194px; width:20; height:685px;"><font color="#330033" size="+2">♦</font></marquee>
<marquee behavior="scroll" direction="down" style="position:absolute; left:81%; top:149px; width:20; height:669px;"><font color="#330033" size="+2">♦</font></marquee>
<marquee behavior="scroll" direction="down" style="position:absolute; left:66%; top:85px; width:20; height:549px;"><font color="#330033" size="+2">♦</font></marquee>

<style>
 font-size: 150%;
}
h1,h2,h3,h4,h5{
 font-size: 200%;
}

body{
background-image: url(https://i.imgur.com/H57Lb9e.jpg);

}
.profile {
 background-color: rgb(255,255,255);
}
/* change all headings on page to different colors. */
  .profile .blurbs .heading,
  .profile .friends .heading{
   background-color: rgb(214, 214, 214);
   color: black;
}
/* change all headings on page to different colors. */
  .profile .contact .heading,
  .profile .table-section .heading{
   background-color: black;
   color: rgb(214, 214, 214);
}

main:before {
  width: auto;
  margin-bottom: 25px;
  border: 4px solid black; 
  height: 120px;
  display: block;
  content: "";
  background-image: url(https://i.imgur.com/zx62Njm.jpg);
  background-position: center center;
  background-size: cover;
}

footer {
  border-radius: 4px; background-image:url(https://i.imgur.com/d46gqQZ.png);
  color:white;
  background-position: center center;

}

table.comments-table td{
   color:rgb();
}

:root { 
 --logo-blue:black;
    --darker-blue: black;
    --lighter-blue: black;
    --even-lighter-blue: ;
    --lightest-blue: ;
    --dark-orange: black;
    --light-orange: black;
    --even-lighter-orange: black;
    --green: pink;
}
</style>

<style>


    .profile  .friends  .person img:not(.icon){


border: 2px outset black !important;


}

/* contact icons */
.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 favorite */
content: "☆"
}

.contact .inner .f-row:nth-child(2) .f-col-nth-child (1) a:before {
/* send a message */
content: "☆"
}

.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
/* foward 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 2 group  */
content: "☆"
}

.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
/* report */
content: "☆"
}   
</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 0 of 0 comments ( View all | Add Comment )