Material Components React Line Ripple


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


React Line Ripple

A React version of an MDC Line Ripple.


npm install @material/react-line-ripple



with Sass:

import '@material/react-line-ripple/index.scss';

with CSS:

import '@material/react-line-ripple/dist/line-ripple.css';

Javascript Instantiation

import LineRipple from '@material/react-line-ripple';

const MyComponent = () => {
  return (
    <LineRipple />


Prop Name Type Description
active boolean Activates or deactivates the line ripple state.
className string Classes to be applied to the root element.
rippleCenter number Sets the center of the ripple animation.
style object Inline styles of root element.

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

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.