Ripples
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-tab-item and many more.

Examples

#1 Buttons
edit
Buttons by default have ripples enabled. This can be removed with the prop :ripple="false".

#2 Custom color
edit
Using a helper class, you can change the color of the ripple.

#3 Tabs
edit
Tabs by default have ripples disabled. This can be enabled with the ripple prop.

#4 Navigation drawers
edit
List items by default have ripples disabled. This can be enabled with the ripple prop.

#5 Toolbars
edit
Toolbar items by default have ripples disabled. This can be enabled with the ripple prop.

#6 Expansion panels
edit
Expansion panels by default have ripples disabled. This can be enabled with the ripple prop.

API

chevron_leftchevron_right