Also known as ripple effect, waves are used to add a smooth animation to any element
when clicking on it.
Adding waves to an element only require to add the
data-waves attribute to it.
Click on the next examples to see the waves effect :
Waves on images
Waves are working on
The only difference is functional, the waves element will be append to the body and not inside of the element.
Customize the waves color by specifying it to the
This is useful to match your website design or to get dark waves for light elements.
|CSS Variable||Default value||Description|
||rgba(255, 255, 255, 0.1)||
Global default waves color.
Accepts all css color values (rgba, hex, rgb).