Bootstrap waves effect

Just add ripple-radius to your elements.

Click me

<!--Button with wave-->
<a class="btn btn-primary btn-lg waves-light" ripple-radius>Click me</a>

<!--Mask with wave-->
<div class="waves-light" ripple-radius>
    <img src="https://mdbootstrap.com/img/Photos/Horizontal/Nature/6-col/img%20(54).jpg" class="img-fluid" alt="Sample image with waves effect.">
</div>
        

Customization

You can change waves effect color to "lighter", adding waves-light:

<!-- Normal -->
<a class="btn btn-primary btn-lg" ripple-radius>Click me</a>

<!-- Lighter --> 
<a class="btn btn-primary btn-lg waves-light" ripple-radius>Click me</a>