Button is used for actions, like in forms, while Link is used for destinations, or moving from one page to another.
In special cases where you'd like to use a <a> styled like a Button, use <Button as='a'> and provide an href.
<Button>Button</Button> <ButtonDanger>Button Danger</ButtonDanger> <ButtonOutline>Button Outline</ButtonOutline> <ButtonPrimary>Button Primary</ButtonPrimary>
Button components get COMMON system props. Read our System Props doc page for a full list of available props.
| Prop name | Type | Default | Description |
|---|---|---|---|
| as | String | button | sets the HTML tag for the component |
| disabled | Boolean | sets the disabled attribute on the Button | |
| grouped | Boolean | allows you to use Button in a line of Buttons without duplicate borders | |
| onClick | Function | function to be called when Button is clicked | |
| size | String | use sm for a small Button, or large for a large Button |