A collection of interactive animation experiments. Each demo explores a different technique — from layout morphing to spring physics — built with React and Framer Motion.

An ultra-realistic rocker power switch. The red paddle tilts with CSS 3D perspective, I/O symbols glow when active, and a mechanical click sound plays on each toggle.

A hyper-realistic ludo dice with recessed dots, surface texture, and light reflections. Drag to spin, or hit Roll for a random throw with spring momentum.

Click anywhere to launch a paper airplane. It flies with gravity, drag, and lift physics, leaving a dotted trail behind it. Launch as many as you want.

A radial frequency visualizer with 64 bars arranged in a circle. Runs in simulated mode by default, or tap “Use mic” to visualize your actual audio input in real-time.

A retro split-flap display clock. Each digit physically flips with CSS 3D transforms when the time changes — top panel folds down to reveal the new number beneath.

A fully functional calculator with the same 3D keycap style as the keyboard. Every key sinks on press with spring physics and plays a click sound. Supports all basic operations.

A 4x4 beat pad inspired by the MPC. Each pad presses down with spring physics, lights up in its color, and plays a synthesized percussion sound. Use your mouse or keyboard (1-4, Q-R, A-F, Z-V).

A field of 640 dots that warp around your cursor. Each dot pushes outward, scales up, and rotates to point away from the cursor — with lines that extend based on proximity. Like a digital pin art toy.

The iconic macOS dock magnification effect. Icons scale up smoothly based on distance from the cursor, with spring physics and proportional neighbor scaling. Tap to bounce.

Finder

Safari

Messages

Mail

Maps

Photos

Music

Notes

Terminal

Settings

An ultra-realistic matte black credit card with 3D tilt that follows your cursor. Features a gold EMV chip, moving light glare, dynamic shadow, and brushed metal texture.

A logo rendered entirely with stippled dots on canvas. Move your cursor over it — dots within range get pushed outward with cubic falloff, then smoothly return via lerp when you move away.

A 3D MacBook-style keyboard that responds to real key presses. Each keycap animates down with a spring when you type, with distinct styles for regular keys, modifiers, and escape.

A project filter using CSS clip-path. A dark overlay is clipped to the active tab, creating a highlight that smoothly slides between options with a CSS transition — no animation library needed.

A floating toolbar that morphs between tool groups. The outer container resizes with a layout spring while inner content slides in vertically. Click format, align, or color to drill into sub-menus.

A submit button that cycles through idle, loading, and success states. Content slides vertically with a zero-bounce spring — old text drops out while new text enters from above.

A recreation of Apple's Dynamic Island. The container morphs smoothly between states using layout animations, with per-transition spring bounce and directional exit variants.