The Riddler

Tags:

Description:

made a riddler theme didn't have much to go off other than black and green so i just tried to be a little creative and minimalistic. plz enjoy ^^

Preview:

click on the image for a larger preview

Code:

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

    
    <style>
  @import url('https://fonts.googleapis.com/css2?family=Major+Mono+Display&display=swap');
  @import url('https://fonts.googleapis.com/css2?family=Cutive+Mono&display=swap');
  @import url('https://fonts.googleapis.com/css2?family=Syne+Mono&display=swap');
  @import url('https://fonts.googleapis.com/css2?family=VT323&display=swap');
    </style>
        
    <style>
      h1 {
        font-family: 'Major Mono Display', monospace;
        font-size: 20px;
        color: #74FFAD;
        font-size: 30px !important;
      }
    </style>
    
    <style>
    //loading screen
 body::before {
content: "";
display: block;
position: fixed;
left: -32px;
top: 0;
width: calc(100% + 32px);
height: calc(100% + 32px);
background-image: url(https://townsquare.media/site/442/files/2022/03/attachment-the-batman.jpg?w=980&q=75);
background-size: cover;
background-position: center;
background-repeat: repeat;
z-index: 10000000;
animation: ScanlineAnimationRight 0.2s linear infinite;
pointer-events: none;
opacity: 1;
animation: hide 0.9s linear 1s 1 forwards;
}

@keyframes hide {
to {
opacity: 0;
}
    // green & web filter
}
.comments-table td{
    background-color: transparent
}
.profile .table-section .details-table td {
background-color:#395044;
}
img {
filter: sepia(100%) hue-rotate(100deg) saturate(5);
}
body::before {
content: " ";
display: block;
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%);
z-index: 2;
background-size: 100% 2px, 3px 100%;
pointer-events: none;
}
body {
    background: url(https://img.wallpapersafari.com/desktop/800/450/13/78/3IKmHz.png);
    background-position:center center;
    no-repeat fixed; background-size:cover;
}
nav .top{
/* navigation bar at the top/the bar that has the search and spacehey logo */
background-color: transparent;
}
main {
  background-color:transparent;
  color: #74FFAD;
}
  .profile .blurbs .section h4 {
font-family: 'Syne Mono', monospace;
font-display: bold;
color: #74FFAD;
font-size: 18px;
border-radius:15px;
border: 7px inset #395044;
}
p{
font-family: 'Cutive Mono', monospace;
font-weight: bold;
color:#74FFAD;
}

nav img.logo {
    content: url("https://64.media.tumblr.com/0eee2ea6cb48ac22ebf695f929580a01/c803df8cc8f9881e-2b/s640x960/df5b551097d30e838f78826bec96d6fd3b10ae0c.pnj")
}
  /* this is the box that says "_'s latest blog entries" */
DIV.blog-preview{
text-align: left;
font-family: 'Syne Mono', monospace;
color: #74FFAD;
}
nav { 
font-size: 11px !important;
font-family: 'Cutive Mono', monospace;
text-shadow: 1px 1px black;
text-transform:none;
padding-left:3px;
font-weight: bold;
text-align: center;
text-decoration-color: #74FFAD;;
}
nav, nav .links a {
color: #74FFAD;
}

.heading, .url-info, .blurbs, .details, .mood, .blog-preview, .friends, .contact, .table, .table-section, footer{
background-color:var(--box_color_and_seethru) !important;
border-radius: var(--curve) !important;
padding: 8px !important;
border: var(--borders) !important;
}
.online img { 
content: url("https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/6c17a15b-6650-4f05-b9cd-5c7d47f3945c/df1yi7s-7388f972-4069-419a-9293-ab84093d2674.jpg?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcLzZjMTdhMTViLTY2NTAtNGYwNS1iOWNkLTVjN2Q0N2YzOTQ1Y1wvZGYxeWk3cy03Mzg4Zjk3Mi00MDY5LTQxOWEtOTI5My1hYjg0MDkzZDI2NzQuanBnIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.ljalhVquyV1sE3gLhJZ7T3tRI6LxMqDEyrYBZuTCjaA");   
        visibility: visible; 
        height: 47px;
        width: 35px;
        animation-name: bounce;
        animation-duration: 3s;
        animation-iteration-count: infinite;
        animation-timing-function: ease-in-out;
}
 h4 {
font-family: 'Major Mono Display', monospace;
color: #74FFAD;
border: 3px solid #395044;
text-align: center;
border-radius:5px;
 }
 .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: "🚩"
}
 a:hover {
     color: #72E7FF; 
   } 
   a{
     color: #74FFDF; 
   }
   nav .links {
background-color: transparent;
}
nav .links a:hover {
color: rgba(255, 199, 226, 1);
}
.comments-table {
border: none;
border-collapse: collapse;
}
.comment-replies {
border: 1px solid #00ff00;
margin: 2px;
}
nav .info {
background: none;
}
.contact {
  border-radius: 8px;
  background-image: url(gif or image url);
  background-position: right top;
  background-repeat: repeat;
background-attachment: scroll;
Width: 310px;
Height:180px;

font-family: 'Cutive Mono', monospace;
color: black;
  text-shadow: 1px 1px 2px #39ff14, 0 0 25px #39ff14, 0 0 3px #39ff14; 
}
 .comments-table td:first-child {
    background-color: transparent;
    text-align: center;
    font-weight: bold;
    width: 35%;
}
.friends .person p, .logout-btn {
color: #74FFDF !important;
}
 </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 10 of 10 comments ( View all | Add Comment )

MysticDoomx3	1722893109 Using Report Comment
хорошо	1720575214 Using Report Comment
tatum!!	1707407334 using!! Report Comment
Demian	1705953204 using! Report Comment
💵 〃 𝗞𝘂𝘆𝗮	1700051247 Using Report Comment
⛤ klitz (AUTOPLAY)⛧	1700005220 using!!!!! ^_^ Report Comment
𝗍𝖺𝗏/𝗍𝗋𝖺𝗏𝖾𝗌 ⍟🍉\| ๑ homestuck.	1699333932 USING!!!!RAAGAH Report Comment
✞.Lacrimosa.✞	1679957740 I'm totally using this layout it looks so good you did amazing! Report Comment
GhostyCure	1676620234 USING OMG Report Comment
vincent ★	1657055970 this is great Report Comment