A [button](https://www.google.com/design/spec/components/buttons.html) clearly communicates what action will occur when the user touches it. It consists of text, an image, or both, designed in accordance with your app’s color theme.
By default it will have neutral colors and a flat aspect even though the `flat` property is `false` by default. Also, some properties exclude others, for example a button cannot be `flat` and `raised` at the same time.
The `Button` component also accept children so if you want to provide a custom component and text instead of a `label` and `icon` you can do it too. Just check the examples.
You can take a look to the `_config.scss` variables. The themed key for this component is `ToolboxButton`, theme should implement the following interface:
| Name | Description|
|:-----------|:-----------|
| `accent` | Used for accent button.|
| `flat` | Used when the button is flat.|
| `floating` | Used when the button is floating.|
| `icon` | For the icon inside a button.|
| `inverse` | Used when colors are inverted.|
| `mini` | Used for mini floating buttons.|
| `neutral` | For neutral colored buttons.|
| `primary` | For primary buttons.|
| `raised` | Used when the button is raised.|
| `toggle` | Used for toggle buttons.|
Since the `Button` implements a ripple, it accepts theme properties for the ripple as well. If you want to compose the default style for the ripple, you just have to provide Ripple keys with custom styles in the theme object.
Icons are appropriate for toggle buttons that allow a single choice to be selected or deselected, such as adding or removing a star to an item. They are best located in app bars, toolbars, action buttons or toggles.
We provide an `IconButton` component bundled with `Button` component. They share a similar API excluding onMouseLeave, onMouseUp and aspect properties.