Waves

Wave

                        <a class="waves-effect waves-light btn-large" href="#">Wave</a>

Available Colors

To use these, just add the corresponding class to your button. Play around with changing the background color of butons and the waves effect to create something cool!

                        <a href="#!" class="btn waves-effect waves-teal">Press Me ;)</a>

Custom Colors

If the color you want is not already available, you can easily make your own waves color by creating a custom CSS class. Take a look at the example below where we add a waves-brown effect

                        /* When creating your CSS selector, change "brown" to something of your choosing */ .waves-effect.waves-brown .waves-ripple { /* The alpha value allows the text and background color of the button to still show through. */ background-color: rgba(121, 85, 72, 0.65); }
                    

                        <a href="#!" class="waves-effect waves-circle waves-light btn-floating secondary-content"> <i class="mdi-content-add"></i> </a>