Button

Interactive UI Explorer

아래에서 각 컴포넌트의 다양한 Variants States를 문서화된 형태로 테스트해볼 수 있습니다.

Button

다양한 variant와 size를 지원하는 버튼 컴포넌트입니다.

Variants

버튼의 다양한 스타일 variant

Primary (Default)
<Button variant="primary">Primary</Button>
Live Preview
Secondary
<Button variant="secondary">Secondary</Button>
Live Preview
Outline
<Button variant="outline">Outline</Button>
Live Preview
Ghost
<Button variant="ghost">Ghost</Button>
Live Preview
Danger
<Button variant="danger">Danger</Button>
Live Preview

Sizes

버튼의 다양한 크기

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

States

버튼의 다양한 상태 (loading, disabled)

Loading
<Button isLoading>Loading</Button>
Live Preview
Disabled
<Button disabled>Disabled</Button>
Live Preview
Normal
<Button>Normal</Button>
Live Preview