Material Components React Button


1,9231710.15.02 years ago3 years agoMinified + gzip package size for @material/react-button in KB


React Button

A React version of an MDC Button.


npm install @material/react-button



with Sass:

import '@material/react-button/index.scss';

with CSS:

import '@material/react-button/dist/button.css';

Javascript Instantiation

import React from 'react';
import Button from '@material/react-button';

class MyApp extends React.Component {
  render() {
    return (
        Click Me!


Prop Name Type Description
className String Classes to be applied to the root element.
raised Boolean Enables raised variant.
unelevated Boolean Enables unelevated variant.
outlined Boolean Enables outlined variant.
dense Boolean Enables dense variant.
icon Element Icon to render within root element.
trailingIcon Element Icon to render on the right side of the element
children String Text to be displayed within root element.
disabled Boolean Disables button if true.
href String Sets a hyperlink & uses anchor tag instead of a button.

Sass Mixins

Sass mixins may be available to customize various aspects of the Components. Please refer to the MDC Web repository for more information on what mixins are available, and how to use them.

Advanced Sass Mixins

Usage with Icons

Please see our Best Practices doc when importing or using icon fonts.

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.