1 min read

Button

The Button component is a core building block in our atomic design system. It's built with accessibility and flexibility in mind.

Basic Usage

Button Variants

Button Sizes

(icon)

Prop	Type	Default	Description
variant	'default' \| 'outline' \| 'ghost'	'default'	Style variant
size	'sm' \| 'md' \| 'lg'	'md'	Button size
disabled	boolean	false	Disabled state

1 min read

The Button component is a core building block in our atomic design system. It's built with accessibility and flexibility in mind.

Button Variants

Button Sizes

(icon)

Prop	Type	Default	Description
variant	'default' \| 'outline' \| 'ghost'	'default'	Style variant
size	'sm' \| 'md' \| 'lg'	'md'	Button size
disabled	boolean	false	Disabled state

import { Button } from '@/components/atoms/button';

function Example() { return <Button>Click me</Button>; }