foogy

Micro

A managed library of micro-interactions, studied from Amicro. Every tile is a live, dependency-free implementation. Copy grabs the React + Motion recipe; select tiles and export them as a SKILL.md any Claude agent can use in any project.

Icon morph

Buttons

Confirm an action in place: copy→check, play→pause, lock→unlock. The state change reads instantly without a toast.

Slide arrow

Buttons

Download / continue / external-link buttons: an icon slides in on hover, hinting at the action direction.

Pulse

Buttons

Hearts, likes, sponsor buttons — a heartbeat on hover invites the click; a springy overshoot confirms it.

Shake

Buttons

Destructive actions (delete, disconnect). The wobble + red tint signals "careful" before the click.

Glare shine

Buttons

Premium / CTA buttons: a skewed light streak sweeps across while hovered. Use sparingly — one per view.

Magnetic

Buttons

Hero CTAs and playful UI: the button leans toward the cursor and springs back on leave.

Text reveal

Buttons

Buttons whose label swaps meaning on hover ("New project" → "Let's go"): two stacked labels roll vertically.

Focus blur

Lists

Link rows, nav menus, social lists: hovering one item blurs and dims all siblings, making focus feel physical.

Card arc fan

Cards

Stacks of images/cards that fan into an arc on hover — galleries, "recent files", hand-of-cards reveals.

Cover flow

Cards

Browsing a small set of items with one in focus — testimonials, artwork, feature carousels. Needs 3D perspective.