Animation Evaluation Benchmark

Implement an animated timeline component featuring staggered entry spring transitions, interactive pill filters, and dynamic layout morphing.

Build an animated SVG loader component that morphs smoothly between geometric shapes (circle, triangle, square, star) using CSS keyframes and spring physics.

Create a hero section with kinetic text reveal animations, character-by-character staggered opacity transitions, floating ambient background spheres, and scroll parallax.

Build an interactive CSS/JS card stack carousel with gesture drag mechanics, card rotation physics, velocity snap points, and stack depth elevation shadows.

Create a burst animation for an interactive bookmark/like heart icon featuring exploding particle confetti, scale bounce, and glowing gradient rings.

Build a multi-section landing page with smooth scroll parallax reveals, scrubbed sticky element pinning, and horizontal image marquee track animations.

Create a 3D perspective credit card component that flips smoothly on hover/click, featuring holographic foil shimmer shaders and dynamic reflection highlights.

Build an image gallery grid where items animate into position with staggered spring physics, blur reveals, and layout morphing expand-on-click modals.

Create a side navigation drawer with elastic spring physics, liquid pull-to-open curves, backdrop backdrop-filter blur transitions, and staggered menu item slide-ins.

Build a canvas-based celebratory particle explosion system with realistic gravity acceleration, wind sway, rotation physics, and auto-cleanup loops.