← Back to Layouts
Jirai kei

Name: FriendRewind
Author: FriendRewind
Author: B1onks
Category: :D
Created: July 16, 2026
jirai kei cutecore esc
Comments (0)

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

<style>
<style>
nav .top {
background-image: url(https://i.pinimg.com/originals/e9/d9/b8/e9d9b8651fd635de28cd4617d8d44d17.gif);
align-items: bottom;
background-size: 255px;
}
  nav .links {
background-image: url(https://i.pinimg.com/originals/e9/d9/b8/e9d9b8651fd635de28cd4617d8d44d17.gif);
text-align: center;
}

</style>
<style>

body {
background-image: url(https://i.pinimg.com/originals/6b/fd/b5/6bfdb5850f53df6ba061aba6c0091085.gif);
background-repeat: no-repeat;
background-size: cover;
 background-position: centre centre;
background-attachment: fixed;
}

main {
background-image: url(https://i.pinimg.com/736x/c2/71/18/c271182e67972f586b9770ccb4bdb12c.jpg);
  background-repeat: no repeat;
background-size: cover;
  background-position: center center
    background-attachment: fixed;
}


</style>online {
  content: 
url("https://i.pinimg.com/originals/02/e4/6c/02e46c69788dc802b5907e393c5bd2d5.gif");
}</style>






<style>
body:before {
content: " ";
height: 100vh;
width: 100vw;
display: block;
position: fixed; 
top: 0; 
left: 0; 
z-index: 100;
background-image: url('https://i.pinimg.com/originals/18/c4/e1/18c4e1297964a392f341b49ec72dfb18.gif');
background-size: cover;
background-repeat: no-repeat;
background-position:center;
animation: yourAnimation 2s ease 0s 1 normal forwards;
pointer-events: none;}
@keyframes yourAnimation { 0.0%{ opacity: 1;} 75%{ opacity: 1; } 100%{ opacity: 0;} }</style><div class="falling-gif">
  <div class="falling-gif"><img src="/proxy/image.php?url=https%3A%2F%2Fpixels.crd.co%2Fassets%2Fimages%2Fgallery06%2F7ae49a77.gif%3Fv%3D29416114"></div>
  <div class="falling-gif"><img src="/proxy/image.php?url=https%3A%2F%2Fpixels.crd.co%2Fassets%2Fimages%2Fgallery23%2F5d01c397.gif%3Fv%3D29416114"></div>
  <div class="falling-gif"><img src="/proxy/image.php?url=https%3A%2F%2Fpixels.crd.co%2Fassets%2Fimages%2Fgallery20%2F438c9920.gif%3Fv%3D29416114"></div>
  <div class="falling-gif"><img src="/proxy/image.php?url=https%3A%2F%2Fpixels.crd.co%2Fassets%2Fimages%2Fgallery37%2F94283d2d.gif%3Fv%3D29416114"></div>
  <div class="falling-gif"><img src="/proxy/image.php?url=https%3A%2F%2Fpixels.crd.co%2Fassets%2Fimages%2Fgallery08%2F69498c83.gif%3Fv%3D29416114"></div>
  <div class="falling-gif"><img src="/proxy/image.php?url=https%3A%2F%2Fpixels.crd.co%2Fassets%2Fimages%2Fgallery16%2Fa10f406c.gif%3Fv%3D29416114"></div>
  <div class="falling-gif"><img src="/proxy/image.php?url=https%3A%2F%2Fpixels.crd.co%2Fassets%2Fimages%2Fgallery21%2Fadf3f0fe.gif%3Fv%3D29416114"></div>
  <div class="falling-gif"><img src="/proxy/image.php?url=https%3A%2F%2Fpixels.crd.co%2Fassets%2Fimages%2Fgallery20%2F72294f9a.gif%3Fv%3D29416114"></div>
</div><style>  @-webkit-keyframes falling-gif-fall {
    0% {
      top: -10%;
    }
    100% {
      top: 100%;
    }
  }
  @keyframes falling-gif-fall {
    0% {
      top: -10%;
    }
    100% {
      top: 100%;
    }
  }
  .falling-gif {
    position: fixed;
    top: -10%;
    z-index: 9999;  /* Change the value to -1 to add the animation to the background */
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: default;
    -webkit-animation-name: falling-gif-fall;
    -webkit-animation-duration: 5s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    animation-name: falling-gif-fall;
    animation-duration: 5s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
  }

/* Specifics to make a more natural fall effect. Feel free to change */
  .falling-gif:nth-of-type(0) {
    left: 1%;
    -webkit-animation-delay: 0s;
    animation-delay: 0s;
  }
  .falling-gif:nth-of-type(1) {
    left: 10%;
    -webkit-animation-delay: 1s;
    animation-delay: 1s;
  }
  .falling-gif:nth-of-type(2) {
    left: 20%;
    -webkit-animation-delay: 2s;
    animation-delay: 2s;
  }
  .falling-gif:nth-of-type(3) {
    left: 30%;
    -webkit-animation-delay: 3s;
    animation-delay: 3s;
  }
  .falling-gif:nth-of-type(4) {
    left: 40%;
    -webkit-animation-delay: 1.5s;
    animation-delay: 1.5s;
  }
  .falling-gif:nth-of-type(5) {
    left: 50%;
    -webkit-animation-delay: 2.5s;
    animation-delay: 2.5s;
  }
  .falling-gif:nth-of-type(6) {
    left: 60%;
    -webkit-animation-delay: 1s;
    animation-delay: 1s;
  }
  .falling-gif:nth-of-type(7) {
    left: 70%;
    -webkit-animation-delay: 3s;
    animation-delay: 3s;
  }
</style></style>