Animation

Press and hover scale tile

A tile that swells on hover and squashes on press, with press always beating hover and both resolved from one spring so gestures never fight.

rest

Using Press and hover scale tile

A tile that swells on hover and squashes on press, with press always beating hover and both resolved from one spring so gestures never fight.

Try the live preview with a pointer and keyboard, then check focus visibility and the narrow layout in your own page. Use the plate number or slug when asking your coding agent to fetch this component.

Props: hoverScale, pressScale, stiffness, accent, showState

Which frameworks are available?

The catalog lists these versions: react, vue, svelte, astro, html. The live preview on this page runs React.

How do I access the implementation?

The preview and component description are public. Sign in with an authorized account to open the code, framework versions and installation panel.

Connect your agent

Nearby

1798Press response tileAnimationA tactile tile that compresses under the press point and springs back on release, tilting toward wherever on its face you pushed.

1822True hover swatchAnimationA color swatch that grows only for a genuine pointer hover, ignoring the fake hover a touch tap fires so it never gets stuck enlarged.

1763Bobble tile gridAnimationA grid of colored tiles that bobble away from the pointer on a spring, bouncing harder the faster the pointer swept across them.

1771Drag tile trackAnimationA tile you can throw around a bounded track that tilts into the drag, resists past the edges and coasts to a stop with momentum.

1780Interruptible hover swellAnimationA tile whose two stage hover swell always starts from its current size, so darting the pointer on and off never makes it snap.

1721Magnetic pull targetAnimationA tile that leans toward the pointer whenever it comes inside a set radius, pulling harder the closer it gets and easing home when the pointer leaves.