Fieldbook
Sign in

Buttons

Uppercase action button

A compact filled action button with an uppercase tracked label, square corners and quiet fill-only hover and pressed states for toolbars and panel headers.

Using Uppercase action button

A compact filled action button with an uppercase tracked label, square corners and quiet fill-only hover and pressed states for toolbars and panel headers.

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, tracking, uppercase, disabled

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 code, framework versions and installation commands are available in the workbench above.

Connect your agent

Nearby

Lifting share chip
2480Lifting share chipButtonsA small solid chip with a glyph and a short caps label that lifts a few pixels and softens on hover, seats itself when pressed, and can toggle a filled glyph.
Sinking lip button
2617Sinking lip buttonButtonsA chunky rounded cap on a darker lip band that collapses on press so the cap sinks flush into its base, then pops back on release.
Arrow to label pill
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.
Border brighten button
2641Border brighten buttonButtonsA dark button whose two pixel frame is the only moving part: it climbs to white on hover and collapses into a tight inner ring while the button is held.
Border trace button
2709Border trace buttonButtonsA quiet translucent button whose four edges draw themselves in sequence on hover while a soft band of light crosses the face.
Bouncing dot action button
2658Bouncing dot action buttonButtonsA dark accent-toned button with a small dot parked by its right edge that hops while the block brightens and casts a soft glow on hover or keyboard focus.