QuackElements
Browse components+
Components/Button

Button

An action element with consistent variants, sizing, and accessible behavior.

Interactive example

Installation

Run the CLI from your project root. Dependencies and component source are added automatically.

$npx quackelements add button

Usage

The generated file lives in your repository, so the component API and styles remain fully editable.

example.tsx
import { Button } from "@/components/quack/button"

export function ButtonDemo() {
  return (
    <div className="flex gap-2">
      <Button>Continue</Button>
      <Button variant="outline">Cancel</Button>
      <Button variant="ghost">Learn more</Button>
    </div>
  )
}