Use Button for actions in forms, dialogs, and more with support for multiple sizes, states, and more. Buttons align perfectly with inputs since they use same spacing variables.
| Component Name | Development Status |
|---|---|
| Button | DONE |
You can find all examples for components developed in this module here.
Very basic Button component examples.
Buttons can be used as blocks. Simply set block option.
There are 3 sizes you can use with buttons. sm, md and lg.
There are several contextual variants you can apply to buttons.
You can manage disable and loading states too.
If you want to use button styles with anchor elements, you can use ButtonLink component.
You can use icons with buttons. Don't remember why i did this?
This component composes styled-system
| Property Name | Type | Description |
|---|---|---|
| variant - 'primary' | enum | Contextual color option. |
| size - 'md' | enum | Changes the size and spacing of buttons. |
| loading - false | bool | Use this when there's a loading operation and you don't want button to be clicked. |
| block - false | bool | Whether button will be a block element. |
| outline | bool |