info

This documentation is for the 1.1.0-beta.x version of Developer portal. For previous versions, refer to 1.0.0-beta.x docs.

Copy
Copied
<Button to="#">Default</Button>

<Button to="#" inversed>
  Inversed
</Button>

<Button to="#" transparent>
  Transparent
</Button>

<Button to="#" transparent inversed>
  Transparent inversed
</Button>

<Button to="#" large>
  Large
</Button>

<Button to="#" small>
  Small
</Button>

Custom colors

You can create a custom color in theme.colors and use it for Button:

Copy
Copied
colors: {
  // ...
  acmeBrand: {
    main: 'orange'
    contrastText: '#fff'
  }
  // ...
}
Copy
Copied
<Button color="acmeBrand">
  Regular
</Button>
<Button color="acmeBrand" size="large" variant="outlined">
  Outlined large
</Button>

Props

NameTypeDefaultDescription
tostringThe URL to link to when the button is clicked.
variant'contained' | 'outlined'containedButton variant.
size'small' | 'medium' | 'large' | 'xlarge'mediumButton size
color'primary' | 'secondary' | 'accent' | 'success' | 'warning' | 'error'primaryDefines color of the button, can use custom color from 'theme.colors'