A lab of small, crafted interaction experiments for React, built with Tailwind CSS v4 and Motion. Buttons, inputs, cards and playful objects, each with a live demo.
Dots swell and part around your cursor, and a click sends a shockwave.
The arrow drops into the tray while the button fills with progress.
Draw a box across files to select them, like the desktop.
Grows out of its trigger, and press, drag, release picks an item like a native menu.
Morphs between live states with a springy, Apple-style bounce.
Drag a cubic-bezier into shape and see it move.
Stretches like rubber when you drag past the end, then springs back.
Pull a string and let go to watch it ring back to rest.
Catches gmial.com and fixes it by moving only the letters that were wrong.
Folds your note into an envelope, seals it and sends it off.
Grows from its slot into a detail view and folds back when you are done.
Opens from a circle into a search field, and closes faster than it opens.
The eye shuts when your password is hidden and watches while you type.
A camera zooms into the part of the product screenshot each feature describes as you scroll past it.
Its dashed edge marches when a file enters the window and seals solid when it is overhead.
Rows fade out of the way while the rest slide up to close the gap.
Turns over in 3D to show what is on the back.
The plus folds away and its actions unfold upward out of the spot it sat in, over a frosted screen.
The label peels up letter by letter, and never covers what you wrote.
Brings the sentence you're reading forward and lets the rest step back.
An itinerary that unfolds panel by panel like a paper road map, recentring as it opens.
Turns its plus into a check as you follow, and warns before you unfollow.
Signs the footer by hand when it scrolls into view, slowing through every loop.
Ticks light up as the value sweeps in, and a peak marker holds where it was before falling.
Folds kraft paper over the cart item, ties a ribbon and bow, and asks who it's for.
A ball of glass rides over the words and magnifies whatever it passes; press and the whole paragraph shivers and flushes indigo.
One small button that opens three ways, all made of the same liquid: a menu that pulls free, a button that swells into one, and a dial that bubbles out.
Greets by time of day, with a sun or moon that rises into place along an arc.
Asks if the page helped, and on a no opens into a field right where the question was.
Fills slowly while you commit to it, snaps back the moment you let go.
One card travels between names as you hover them.
Hover a link to get a preview card that trails your cursor and leans as it moves.
Icons reshape themselves between states instead of swapping.
Draws a leader line to one label card that travels between a watch's features, never covering the product.
Pan, pinch and zoom around a board of notes.
Drains a glass inkwell as you spend your character limit.
Edits your name and bio in place without moving a pixel.
Lift a card and the others slide aside to make room for it.
Keycaps that sink when you press the real keys.
Players glide past each other to their new ranks.
A lens follows your cursor and shows the specs hidden under a card.
Pops, bursts and rolls the count when you like.
Breathes while live, lets the viewer count drift, and blinks hollow while reconnecting.
Four loaders that each know how to finish: leapfrog dots, an inchworm bar, a ring that closes into a check.
Logos orbit a heading on tilted rings, passing behind it, and brake to a stop when you point.
Stretches toward your cursor like soft rubber on a magnet, then wobbles home.
Lines turn toward your cursor like iron filings near a magnet.
Drifts endlessly past a reading lens, and brakes gently when you hover.