# Ripple directive

The v-ripple directive is used to show action from a user. It can be applied to any block level element. Numerous components come with the ripple directive built in, such as the v-btn, v-tabs-item and many more.

# Usage

Basic ripple functionality can be enabled just by using v-ripple directive on a component or an HTML element

# API

# Examples

# Options

# Center

When a center option is used ripple will always originate from the center of the target.

# Misc

# Custom color

Using a helper class, you can change the color of the ripple.

# Ripple in components

Some components provide the ripple prop that allows you to control the ripple effect. You can turn it off or customize the behavior by using class or center options.

Ready for more?

Continue your learning with related content selected by the Team or move between pages by using the navigation links below.
Buttons
Components
Expansion panels
Components
Transitions
Styles
Edit this page on GitHub
Last updated:06/29/2020, 1:12:58 PM