---
path: "/button/props"
component: "button"
type: "atom"
date: "2017-07-12T17:12:33.962Z"
title: "Button"
---

| Prop | Description | Type | Default |
| ------ | ----------- | ---- | ------- |
| bg | background color of the button | color string / from theme | theme.primaryColor |
| border | sets `border` CSS property | string | none |
| borderColor | border color of the button | color string / from theme | null |
| borderStyle | sets `border-style` css Property | string | null |
| color | color of the button | color string / from theme | white |
| fontFamily | font-family CSS property | string / from theme | 'Serverless' |
| fontSize | font-size CSS property | px string / from theme | null |
| letterSpacing | letter spacing for the button text | px string / from theme | theme.letterSpacing.primaryBtn |
| m | margin | px string / from theme| null |
| mb | margin bottom | px string / from theme | null |
| minwidth / maxWidth | width of the button | px string / from theme| null |
| ml | margin left | px string / from theme | null |
| mr | margin right | px string / from theme | null |
| mt | margin top | px string / from theme| null |
| mx | margin for left and right | px string / from theme| null |
| my | margin for top and bottom | px string / from theme| null |
| p | padding for all 4 side | px string / from theme| 1.8rem |
| pb | padding bottom | px string / from theme| null |
| pl | padding left | px string / from theme| null |
| pr | padding right | px string / from theme| null |
| pt | padding top | px string / from theme| null |
| px | padding for left and right | px string / from theme| null |
| py | padding for top and bottom | px string / from theme| null |
| width | width of the button | px string / from theme| 280px |