Layout floating animation

Tags: animation, profile animation, floating, filter, layouts, cute

Description:

This animation has a floating effect. Literally that's all. It also has a tv filter on it.
If you use it please comment! ty!
Also if you wanna see how the animation looks, just go on my profile, it'll always be there. This animation works on most layouts!

Preview:

click on the image for a larger preview

Code:

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

<style>

h1{
  animation: type 3s steps(27);
  color: white;
  font-size: 10px;
  font-family: courier;
  white-space: nowrap;
  overflow: hidden;
  }

@keyframes type{
  0%{
    width:0ch;
  }
  
  100%{
    width:27ch;
  }
}

@keyframes blink{
  0%{opacity:1;}
  50%{opacity:0;}
  100%{opacity:1;}
}

body::before {
content: " ";
display: block;
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: linear-gradient(rgb(82 15 15 / 48%) 50%, rgb(0 0 0 / 0%) 50%);
z-index: 2;
background-size: 100% 2px, 3px 100%;
pointer-events: none;
}

.col, main, footer, nav::before, .online, nav .links, nav .top {
animation: float 4s;
animation-iteration-count: infinite;
animation-timing-function: ease-in-out;
}

.col, main, footer, nav::before, .online, nav .links, nav .top {
animation: float 4s;
animation-iteration-count: infinite;
animation-timing-function: ease-in-out;
}
@keyframes float {
0% { transform: translate(0, 0px);
}
50% {
transform: translate(0, 8px);
}
100% {
transform: translate(0, -0px);
}

</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 20 of 237 comments ( View all | Add Comment )

*-I/l0v3 vaflezz$°=°	1747159061 Usee Report Comment
*-I/l0v3 vaflezz$°=°	1747159058 Usee Report Comment
vivichu	1747065430 using :3 Report Comment
5525	1746990002 usinggg Report Comment
nayuhh	1746357209 using Report Comment
nayuhh	1746357209 using Report Comment
Arii	1745096106 Using Report Comment
Mikey	1744692053 usiiing :) Report Comment
montxnismxp	1744551408 usingg Report Comment
🪼\|JO☆	1744313449 Using^^ Report Comment
★ミカサ★	1744191633 using!!! Report Comment
riri ᶻ 𝗓 𐰁	1743884185 usingggg Report Comment
𝓐𝓷𝓬𝓻𝓪𝓽𝓲𝓬☆	1743797808 Using Report Comment
enjel	1743057538 using! Report Comment
vampiremellow	1742729086 using Report Comment
‌ ‌ ‌ ‌ ‌𝒮 𝗁𝗂𝗄i‌ ‌ ‌‌ ‌ ‌	1742125402 Using Report Comment
stuart	1741680596 using ^^ Report Comment
zoobs <3	1741592073 usinggg Report Comment
vernal	1741487682 usinggg Report Comment
spicy popcorn	1741340847 using Report Comment