Button

Trigger an action or submit a form.

Installation

import { Button } from "~/components/ui/Button";

Usage

<Button>Request a quote</Button>

Variants

<Button>Primary</Button>
<Button variant="outline">Outline</Button>
<Button variant="ghost">Ghost</Button>
<Button variant="danger">Danger</Button>

Sizes

<Button size="sm">Small</Button>
<Button size="md">Medium</Button>
<Button size="lg">Large</Button>

API reference

PropTypeDefaultDescription
variant"primary" | "outline" | "ghost" | "danger""primary"Visual style of the button.
size"sm" | "md" | "lg""md"Control height and padding.
disabledbooleanfalseDisable interaction and dim the button.

Accessibility

  • Renders a native button element, so keyboard activation and screen-reader semantics work by default.
  • Focus-visible shows a token-colored outline; the disabled state removes pointer events.
View site