Buttons

Sheen scale button

A fixed size filled button with a diagonal two tone sheen that swells slightly and casts a matching halo when hovered or focused.

Hover, press or tab to the button: the face swells, the sheen shifts and a tight halo lights up underneath.

Using Sheen scale button

A fixed size filled button with a diagonal two tone sheen that swells slightly and casts a matching halo when hovered or focused.

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, accent, growth, halo

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

2578Swelling pill buttonButtonsA one-hue gradient pill that swells larger on hover while a tinted shadow spreads beneath it, and compresses briefly when pressed.

2314Charge Up Action ButtonButtonsA charcoal pill that lights into a saturated gradient key on hover, lifting off the surface while its mark turns and brightens.

2711Count Sweep CTAButtonsA compact dark call to action with a leading mark, a divider and a live tally, crossed by a slow diagonal light streak on hover.

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.

2763Draining fill buttonButtonsA flooded button that drains out of one edge on hover, leaving a hollow outline with the label flipped to the accent.

2560Drifting aura buttonButtonsA softly embossed slanted pad that wakes a blurred band of color behind its edges and lets the brightest part drift around the outline.