← Back to Layouts
old broken spacehey layout

Name: FriendRewind
Author: FriendRewind
Author: Zoe_Zombie [glmrklldUS!]
Category: :D
Created: July 6, 2026
Comments (0)

No comments yet. Be the first!
You must log in to comment.
CSS Code

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


<style>
body {
        background:url(https://i.postimg.cc/GtfVmNNb/Screenshot-2024-12-26-8-51-53-PM.png);
}
.profile {
background:url(https://i.postimg.cc/zBc5rm2z/black-background.png);
color:#ff0095;
text-shadow: 0 0 9px black;
}
.profile .contact, .profile .table-section, .profile .url-info, .profile .friends, .profile .blurbs, table.comments-table, DIV.blog-preview { 
  border-style:ridge; 
 border-width:6px; 
 border-color:#ff0095; 
text-shadow: 0 0 9px black;
background:#520030;
}


/* 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: "♬"
}
footer {
border-radius: 15px;
background-image: 
url(https://i.postimg.cc/zBc5rm2z/black-background.png);
color:White; 
}
.online{
content: url(http://www.myspacegens.com/images/online_now/128.gif);
}
nav .top {
        background: url("https://i.postimg.cc/zBc5rm2z/black-background.png
");
}
:root {
--logo-blue: White;
--darker-blue:white;
--lighter-blue:#8e0d3e;
--even-lighter-blue:#8e0d3e;
--lightest-blue:##3c0130;
--dark-orange:White;
--light-orange:#8e0d3e;
--even-lighter-orange:black;
--green:black;#ff0090
}




}
div.ah.df.dg.dh {
    border-radius: 0 0 10px 10px;
}
div.b4.ah.dx.dy.dz.e0 {
    border-radius: 10px 0 0 0;
}
</style>


<div class="background"></div>
ㅤ
<div class="about"> 
ㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤ




ㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤㅤ
</div>


<div>




</div>


<style>
.friends .heading{ font-size:0; }
.friends .heading:before{ content: "Cool people! ☆"; font-size:.8rem; font-weight:bold; 
color:White; } 
}
.friends#comments .heading{ font-size:0; }
.friends#comments .heading:before{ content: "Comments from friends! ☆"; font-size:.8rem; font-weight:bold;
color:White; } 
}
{
}
.profile .table-section .heading h4 { font-size:0; }
.profile .table-section .heading h4:before{ content: "My Interests + Socials! ☆"; font-size:.8rem; font-weight:bold;
color: white; }
}
{
}
.contact .heading{ font-size:0; }
.contact .heading:before{ content: "Say hi! (I dont bite >:3) ☆"; font-size:.8rem; font-weight:bold;
color: white; }
}
{
}
.blurbs .heading{ font-size:0; }
.blurbs .heading:before{ content: "About me! ☆"; font-size:.8rem; font-weight:bold; color:White; }
}
* {cursor: url(https://cur.cursors-4u.net/anime/ani-1/ani195.ani), url(https://cur.cursors-4u.net/anime/ani-1/ani195.png), auto !important;}</style><a href="https://www.cursors-4u.com/cursor/2008/11/07/blinking-hello-kitty-4.html" target="_blank" title="Fast Blinking Hello Kitty"><img src="https://cur.cursors-4u.net/cursor.png" alt="Fast Blinking Hello Kitty" style="position:absolute; top: 0px; right: 0px;"/></a>
<style>
</style>

<iframe width="0" height="0" src="https://www.youtube.com/embed/T0lZOVPM6wo?si=9vUDL1UM1ngVRopq//? &;amp;;autoplay=1&loop=1&;controls=1" title="IDK" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" loading="lazy">
</iframe>





 <style>
 .candy {
--color1: #000000;
--color2: #fb01a6;
 
-webkit-text-stroke: 0.5px #ffbad9;
background: repeating-linear-gradient(
45deg,
var(--color1),
var(--color1) 30px,
var(--color2) 30px,
var(--color2) 60px
);
 
background-clip: text;
color: transparent;
-webkit-background-clip: text;
font-size: 2em; 
animation: 20s linear 0s infinite move;
}
 
@keyframes move {
from {
background-position: 0px;
}
to {
background-position: 1000px;
}
}
 
</style>
 
<div class="candy">Song: Box Full of Sharp Objects </div>



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

<style>
  @keyframes spin {
    100% {
      transform:rotate(360deg);
    }
  }
  
  .recordPlayer {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 20px;
  }
  .cd{
    height: 150px;
    margin-left: 55px;
    padding: 10px;
    animation: spin 1.88s linear infinite;
    position: absolute;
  }
  .cdCover {
    height: 150px;
    position: relative;
    z-index: 1;
    margin-right: 55px;
  }
</style>

<div class="recordPlayer">
  <img class="cd" src="https://fluorescent-lights.neocities.org/Digital-CD-Disk-Vector-Transparent-PNG.png"/>
  <img class="cdCover" src="https://i.postimg.cc/vZ8fWDnp/Screenshot-2025-06-04-2-34-03-PM.png"/>
</div>

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

<style>
.online {
        content: url("https://dl.glitter-graphics.com/pub/34/34221lhhaecsv59.gif")}</style>








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

<!----- VINYL VINYL VINYL VINYL ---->



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

<style>
 .candy {
--color1: #000000;
--color2: #fb01a6;
 
-webkit-text-stroke: 0.5px #ffbad9;
background: repeating-linear-gradient(
45deg,
var(--color1),
var(--color1) 30px,
var(--color2) 30px,
var(--color2) 60px
);
 
background-clip: text;
color: transparent;
-webkit-background-clip: text;
font-size: 2em; 
animation: 20s linear 0s infinite move;
}
 
@keyframes move {
from {
background-position: 0px;
}
to {
background-position: 1000px;
}
}
 
</style>
 
<div class="candy">★MY FAVORITE ALBUMS!!!★</div>



<style>
#vinyl-gallery * {
    all: unset;
  }
 
  #vinyl-gallery {
    all: initial!important;
    width: 100%!important;
    height: 230px!important;
    margin: 30px 0!important;
    display: flex!important;
    flex-direction: row!important;
    position: relative!important;
    margin-left: -6px!important;
  }
 
  #vinyl-gallery .vinyl {
      all:unset!important;
    perspective: 500px !important;
    width: 18px!important;
    transition: width 0.5s!important;
  }
 
  #vinyl-gallery .vinyl:hover {
    width: 148px!important;
  }
 
  #vinyl-gallery img {
      all:unset!important;
    transition: transform 0.5s, width 0.5s, height 0.5s, margin-top 0.5s!important;
    width: 180px!important;
    height: 180px!important;
    transform: rotateX(0deg) rotateY(25deg)!important;
    transform-style: preserve-3d!important;
    border-radius: 4px!important;
    border: 2px solid rgba(0, 0, 0, 0.1)!important;
object-fit: cover!important;
  }
 
  #vinyl-gallery .vinyl:hover img {
    transform: rotateX(0deg) rotateY(10deg)!important;
    width: 188px!important;
    height: 188px!important;
    margin-top: -2px!important;
  }
 
  #vinyl-gallery .title {
    color: #000000;
    display: block;
    visibility: hidden;
    position: absolute;
    bottom: 0px;
    text-align: center;
    width: 100%;
    padding-left: 6px;
  }
 
  #vinyl-gallery .vinyl:nth-child(n):hover + .title {
    visibility: visible;
  }

</style>
<div id="vinyl-gallery">
  <div class="vinyl">
    <img src="https://i.postimg.cc/y8ZThFCv/I-Brought-You-My-Bullets-You-Brought-Me-Your-Love-cover.jpg"/>
  </div>
  <div class="title"></div>

  <div class="vinyl">
    <img src="https://i.postimg.cc/RZ6gPkK1/Three-cheers-clean.jpg"/>
  </div>
  <div class="title"></div>

  <div class="vinyl">
    <img src="https://i.postimg.cc/5NVX6LNw/Blackparadecover.jpg"/>
  </div>
  <div class="title"></div>

  <div class="vinyl">
    <img src="https://i.postimg.cc/DwfmchG0/Danger-Days-album-2010.jpg"/>
  </div>
  <div class="title"></div>

  <div class="vinyl">
    <img src="https://i.postimg.cc/TPTWymdy/Bestkindamess.jpg"/>
  </div>
  <div class="title"></div>

  <div class="vinyl">
    <img src="https://i.postimg.cc/bJJDgh2p/EOTGMcover.jpg"/>
  </div>
  <div class="title"></div>

  <div class="vinyl">
    <img src="https://i.postimg.cc/Gh5rhsZF/Screenshot-2026-01-10-11-44-45-PM.png"/>
  </div>
  <div class="title"></div>

  <div class="vinyl">
    <img src="https://i.postimg.cc/28VRJS3K/Screenshot-2026-01-10-11-45-45-PM.png"/>
  </div>
  <div class="title"></div>

  <div class="vinyl">
    <img src="https://i.postimg.cc/vm7p91S4/Screenshot-2026-01-10-11-46-34-PM.png"/>
  </div>
  <div class="title"></div>

  <div class="vinyl">
    <img src="https://i.postimg.cc/QdVhtd5Q/600x600bf-60.jpg"/>
  </div>
  <div class="title"></div>

  <div class="vinyl">
    <img src="https://i.postimg.cc/43mkJLDB/So-wrong-its-right.jpg"/>
  </div>
  <div class="title"></div>

  <div class="vinyl">
    <img src="https://i.postimg.cc/kXrNJ2bS/ab67616d0000b2734edea13391eda9d2a71fc58e.jpg"/>
  </div>
  <div class="title"></div>

  <div class="vinyl">
    <img src="https://i.postimg.cc/yxf240Lw/Hello-Fascination1.jpg"/>
  </div>
  <div class="title"></div>

  <div class="vinyl">
    <img src="https://i.postimg.cc/J0ncFdtW/Screenshot-2024-12-26-9-21-55-AM.png"/>
  </div>
  <div class="title"></div>

  <div class="vinyl">
    <img src="https://i.postimg.cc/Zn0VN2LM/c3d30c023c8eb685fc1649ec2f1eca36-300x300x1.jpg"/>
  </div>
  <div class="title"></div>

  <div class="vinyl">
    <img src="https://i.postimg.cc/598YmnXH/ab67616d00001e02022decfcb623fd5646799dbf.jpgE"/>
  </div>
  <div class="title"></div>

 </div>






<style>
#vinyl-gallery * {
    all: unset;
  }
 
  #vinyl-gallery {
    all: initial!important;
    width: 100%!important;
    height: 230px!important;
    margin: 30px 0!important;
    display: flex!important;
    flex-direction: row!important;
    position: relative!important;
    margin-left: -6px!important;
  }
 
  #vinyl-gallery .vinyl {
      all:unset!important;
    perspective: 500px !important;
    width: 18px!important;
    transition: width 0.5s!important;
  }
 
  #vinyl-gallery .vinyl:hover {
    width: 148px!important;
  }
 
  #vinyl-gallery img {
      all:unset!important;
    transition: transform 0.5s, width 0.5s, height 0.5s, margin-top 0.5s!important;
    width: 180px!important;
    height: 180px!important;
    transform: rotateX(0deg) rotateY(25deg)!important;
    transform-style: preserve-3d!important;
    border-radius: 4px!important;
    border: 2px solid rgba(0, 0, 0, 0.1)!important;
object-fit: cover!important;
  }
 
  #vinyl-gallery .vinyl:hover img {
    transform: rotateX(0deg) rotateY(10deg)!important;
    width: 188px!important;
    height: 188px!important;
    margin-top: -2px!important;
  }
 
  #vinyl-gallery .title {
    color: #000000;
    display: block;
    visibility: hidden;
    position: absolute;
    bottom: 0px;
    text-align: center;
    width: 100%;
    padding-left: 6px;
  }
 
  #vinyl-gallery .vinyl:nth-child(n):hover + .title {
    visibility: visible;
  }


</style>
<div id="vinyl-gallery">
  <div class="vinyl">
    <img src="https://i.postimg.cc/k4QK5QwB/Screenshot-2025-01-21-5-51-26-PM.png"/>
  </div>
  <div class="title"></div>


  <div class="vinyl">
    <img src="https://i.postimg.cc/gcK3FKn7/Screenshot-2025-01-21-5-52-44-PM.png"/>
  </div>
  <div class="title"></div>


  <div class="vinyl">
    <img src="https://i.postimg.cc/j5NTRXby/Lies-for-the-liars.jpg"/>
  </div>
  <div class="title"></div>


  <div class="vinyl">
    <img src="https://i.postimg.cc/L6Cfh6kB/Screenshot-2025-06-04-2-41-35-PM.png"/>
  </div>
  <div class="title"></div>


  <div class="vinyl">
    <img src="https://i.postimg.cc/6QdKJ55F/Screenshot-2025-01-21-6-00-18-PM.png"/>
  </div>
  <div class="title"></div>


  <div class="vinyl">
    <img src="https://i.postimg.cc/9MCmQPwq/In-Love-and-Death.jpg"/>
  </div>
  <div class="title"></div>


  <div class="vinyl">
    <img src="https://i.postimg.cc/nrNNCZSw/Screenshot-2025-02-12-8-17-03-PM.png"/>
  </div>
  <div class="title"></div>


  <div class="vinyl">
    <img src="https://i.postimg.cc/6p8ZZJYs/Screenshot-2025-02-12-8-18-40-PM.png"/>
  </div>
  <div class="title"></div>


  <div class="vinyl">
    <img src="https://i.postimg.cc/ZqB9cN5D/Screenshot-2025-06-04-2-37-10-PM.png"/>
  </div>
  <div class="title"></div>


  <div class="vinyl">
    <img src="https://i.postimg.cc/jjmf0X1b/Screenshot-2025-06-04-2-35-02-PM.png"/>
  </div>
  <div class="title"></div>


  <div class="vinyl">
    <img src="https://i.postimg.cc/yYvhJ7Pm/Screenshot-2025-12-13-4-13-49-PM.png"/>
  </div>
  <div class="title"></div>


  <div class="vinyl">
    <img src="https://i.postimg.cc/vZ8fWDnp/Screenshot-2025-06-04-2-34-03-PM.png"/>
  </div>
  <div class="title"></div>


  <div class="vinyl">
    <img src="https://i.postimg.cc/QN2MVfzY/Screenshot-2025-10-25-7-12-44-PM.png"/>
  </div>
  <div class="title"></div>


  <div class="vinyl">
    <img src="https://i.postimg.cc/XqrH2Xxx/Screenshot-2026-01-10-11-49-36-PM.png"/>
  </div>
  <div class="title"></div>


  <div class="vinyl">
    <img src="https://i.postimg.cc/0j5M2LbB/Screenshot-2025-06-04-2-32-48-PM.png"/>
  </div>
  <div class="title"></div>


  <div class="vinyl">
    <img src="https://i.postimg.cc/Fs2qBbMj/Screenshot-2026-01-10-11-47-49-PM.png"/>
  </div>
  <div class="title"></div>


 </div>




<!-- (c) Layout created by 𝙎𝙩𝙧𝙖𝙬𝙗𝙚𝙧𝙧𝙮 𝙘𝙧𝙚𝙥𝙚 (https://layouts.spacehey.com/layout?id=31763) -->

<style>
body:before {
content: " ";
height: 100vh;
width: 100vw;
display: block;
position: fixed; 
top: 0; 
left: 0; 
z-index: 100;
background-image: url('https://i.postimg.cc/hv6RwH4k/Screenshot-2024-12-26-5-31-36-PM.png');
background-size: cover;
background-repeat: no-repeat;
background-position:center;
animation: yourAnimation 5s ease 0s 1 normal forwards;
pointer-events: none;}
@keyframes yourAnimation { 0.0%{ opacity: 1;} 75%{ opacity: 1; } 100%{ opacity: 0;} } 
</style>







<style>
.logo {
content:url("https://i.postimg.cc/1RjHfbRQ/611-6116955-myspace.png");
}
</style>   

<style>




</style>





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

<style>
/* replace with cd image that has transparent background. must be 150px by 150px. */
:root {
--cd-image: url('https://fluorescent-lights.neocities.org/Digital-CD-Disk-Vector-Transparent-PNG.png');
}
.profile-pic {
position: relative;
width: 183px;
filter: drop-shadow(0 0 0.25rem gray);
}
.profile-pic:after {
content: "";
background: url('https://fluorescent-lights.neocities.org/f0rzNHe.png'), linear-gradient(150deg, rgba(255,255,255,0.4), rgba(255,255,255,0.2), 40%, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0.6));
background-size: contain, cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.profile-pic:before {
content: "";
background: var(--cd-image);
position: absolute;
top: 5px;
left: -20px;
width: 150px;
height: 150px;
background-repeat: no-repeat;
z-index: -1;
animation-name: spin;
animation-duration: 5000ms;
animation-iteration-count: infinite;
animation-timing-function: linear; 
transition: left ease 0.5s;
}
.profile-pic:hover:before {
left: -75px;
}
@keyframes spin {
    from {
        transform:rotate(0deg);
    }
    to {
        transform:rotate(360deg);
    }
}
.profile-pic .pfp-fallback {
float: right;
width: 163px;
height: 160px;
border: none;
}
.general-about .profile-pic img {
max-width: inherit;
}
</style></style>