Dasar UI Library
Button
Lorem ipsum dolor sit amet consectetur adipisicing elit. Fugiat cupiditate odit ipsa quaerat blanditiis vel eveniet, aut esse laudantium similique quo nobis odio nostrum ipsam consequatur. Magni odit maiores nesciunt?Variant
Appearance
Sizes
Radius
With Icons
State & Layouts
API Reference
Property | Type | Default | Description |
|---|---|---|---|
variant | 'primary' | 'success' | 'warning' | 'danger' | 'secondary' | 'ghost' | 'primary' | Defines the semantic color intent of the button. |
appearance | 'solid' | 'subtle' | 'outline' | 'solid' | Defines the fill and border appearance style. |
size | 'xs' | 'sm' | 'md' | 'lg' | 'md' | Controls the button size, scaling padding and typography proportionally. |
radius | ScaleAttributeType | 'md' | Sets the border radius curve of the button. |
type | 'button' | 'submit' | 'reset' | 'button' | Standard native HTML button type attribute. |
fluid | boolean | false | Expands the button to fill the full width of its container. |
full-width | boolean | false | Applies full-width layout constraints to the button host element. |
icon-only | boolean | false | Optimizes padding and layout for buttons containing only an icon. |
disabled | boolean | false | Disables user interaction and applies a muted visual state. |
button-style | StyleType | null | Allows passing custom inline styles directly to the button element. |
button-class | ClassType | null | Allows passing custom CSS classes to override or extend styles. |