All components
Button
Trigger actions with solid, surface, outline, ghost, and glass variants across six sizes — polymorphic via asChild (Ark) or render (Base UI).
Variants
solid
subtle
surface
outline
ghost
plain
Sizes
xs
sm
md
lg
xl
Install
zsh — button
1bunx stylexblocks add buttonUsage — Ark UI
button.tsx
1234567891011121314151617181920212223import { Button } from "#components/ui/ark-ui/button.tsx";import { indigoPalette } from "@stylexblocks/ui/themes/palettes.ts";
export function Example() { return ( <> {/* variant + size props resolve through the StyleX recipe */} <Button variant="solid" size="md" palette={indigoPalette} onClick={save}> Get started </Button>
{/* composition: asChild forwards everything onto your element */} <Button asChild variant="surface" size="md"> <a href="/docs">Read the docs</a> </Button>
{/* native props pass straight through */} <Button variant="outline" disabled aria-label="Retry sync"> Retry </Button> </> );}