Button
Clickable element for actions. Use .btn as base class with optional modifiers.
Variants
<button class="btn">Default</button>
<button class="btn btn-outline">Outline</button>
<button class="btn btn-ghost">Ghost</button> Sizes
<button class="btn btn-sm">Small</button>
<button class="btn">Medium</button>
<button class="btn btn-lg">Large</button> Disabled
<button class="btn" disabled>Disabled</button>
<button class="btn btn-outline" disabled>Disabled outline</button> Class Reference
| Class | Description |
|---|---|
| .btn | Base button — primary background |
| .btn-outline | Transparent background with primary border |
| .btn-ghost | Transparent, shows muted hover bg |
| .btn-sm | Smaller padding and font size |
| .btn-lg | Larger padding and font size |