ripple-button

npm i ripple-button

or

yarn add ripple-button

import Ripple from 'ripple-button'
<Ripple>
  <h1>hello ripple</h1>
</Ripple>

props

• color 【String】 ripple color default: rgba(0, 0, 0, 0.3);
• duration 【Number】 Animation time default: 800ms

import Ripple from 'ripple-button'
<Ripple color="rgba(12, 33, 124, 0.3)" duration={500}>
  <h1>hello ripple</h1>
</Ripple>

useRipple

you can bind ripple on DOM element

import { useRipple } from 'ripple-button'
useRipple(document.body, 'rgba(12, 232, 44, 0.1)', 600)