Buttons

Emboss swap button

A small saturated chip that trades its flat cast shadow for a four way moulded relief on hover, so the surface appears to be pressed out of the page.

Using Emboss swap button

A small saturated chip that trades its flat cast shadow for a four way moulded relief on hover, so the surface appears to be pressed out of the page.

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, radius, depth, size

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

2579Breathing Inset ButtonButtonsA pale moulded button whose inner panel pulls away from the rim on hover while the send glyph slides a short distance toward the label.

1926Brightening gradient buttonButtonsA deep two-tone chip whose vertical wash climbs to a much brighter pair of the same family on hover, with a fixed glass highlight along its top edge.

2471Center bloom buttonButtonsA solid rounded pill that brightens from the middle out as a pale circular wash grows past its own edges, then sinks flat when pressed.

1678Corner flood buttonButtonsA dark rectangular button with a small colour chip parked half off its top left corner that swells until it floods the whole face when the button is engaged.

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.

2534Elevated chip buttonButtonsA pale rounded chip resting on stacked soft shadows that tints toward the accent on hover and sinks onto a deeper shadow with an accent outline when pressed.