Button
Button
A native button element for capturing user taps on touch devices, or mouse clicks on desktop devices with onClick action handler.
In browser, you can pass all event handlers supported by the button element.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| children | String |Number |Boolean |Function | Required | Button content |
| className | Class Name | CSS class names separated by space | |
| active | Boolean | Whether to add | |
| disabled | Boolean | Whether the button is disabled | |
| loading | Boolean | Whether to show loading state | |
| type | Enum | Button type | |
| tooltip | String |Number |Boolean |Function |Object | Tooltip props (or content) to display as popup on interaction with this component | |
| _ref | Function |Object |
Examples
Button Colors
Theme Palette
Callout
Shades
Others
Button Sizes
Sizes
Button States
Active button
Disabled button
Loading state
Button Styles
Theme style border radius
Rounded (Tailwind CSS style)
Round (circular - 50% border radius)
Circle - maintained aspect ratio of 1:1
Square - maintained aspect ratio of 1:1
Button Icons
Example
Icon with Text