Button

Seven variants and five sizes in uppercase mono. primary is filled phosphor; signal marks urgent states.

pulls in@base-ui/reactclass-variance-authority@afterglow/theme

Installation

npx shadcn@latest add @afterglow/button

Sizes

Tracking opens up with the size, so a large button does not read as a small one enlarged.

With an icon, and disabled

API Reference

To render something other than a <button>, pass render and turn off nativeButton: <Button render={<Link href="/x" />} nativeButton={false}>Go</Button>.

Button

primary is the filled phosphor action. Keep signal for alarms and urgent states.

PropTypeDefault
variant"default" | "primary" | "signal" | "outline" | "ghost" | "destructive" | "link""default"
size"default" | "sm" | "lg" | "icon" | "icon-sm""default"

Everything else is Base UI button's API, documented there.