Hover Lift 3D
Hover to triggerPushes toward the viewer on Z with a slight pitch — a 3D pop.
Move the pointer over the box
Triggered by
:hover and never auto-plays on load. Move the pointer in and out to watch it again.
Tune parameters
Interactive animations are driven by pointer state; duration and easing live on
transition / animation — change the numbers in the code below.
Full code
/* Hover Lift 3D */
.anim-hover-lift-3d {
transition: transform .3s cubic-bezier(.22,.61,.36,1);
}
.anim-hover-lift-3d:hover {
transform: perspective(500px) translateZ(28px) rotateX(6deg);
}