Buttons

Share fan button

A share button that dissolves on hover while a row of square destination buttons unrolls out of its left edge, one after another.

Field notes from the Alta ridge traverse

Using Share fan button

A share button that dissolves on hover while a row of square destination buttons unrolls out of its left edge, one after another.

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: label, count, accent, openOn, stagger

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

2469Arrow to label pillButtonsA round chevron button that stretches into a wide labeled pill on hover, trading the mark for a word as the flat fill becomes a two-stop ramp.

1848Center out fill buttonButtonsAn outlined uppercase button whose accent fill opens from a hairline at the center out to both edges on hover or focus.

2553Collapsing share buttonButtonsA labelled pill that shrinks to a round glyph while a strip of link tiles floats into the space it left.

2622Disc to Pill CTAButtonsA small filled disc beside a bare uppercase label stretches into a full pill on hover or focus, revealing the text and carrying the arrow along.

2350Expanding chip back buttonButtonsA pale pill button whose accent chip stretches across the full width on hover, carrying its arrow to the far side while the label stays put and gets covered.

2714Expanding icon pillButtonsA round icon button that stretches into a labelled pill on hover, trading its glyph for a word as an accent fill arrives.