Material Design Ripple Click/Tap Effect In Vue


A Vue directive that applies a Material Design inspired ripple effect to components when clicked.

Basic Usage:

1. Import and register the directive.

import Vue from "vue";
import Ripple from "vue-material-design-ripple";
import "vue-material-design-ripple/dist/vue-material-design-ripple.css";
Vue.directive("ripple", Ripple);

2. Add a ripple click/tap effect to your element.

  <div class="clickme" :style="{color}" v-ripple="{center,class: rippleClass}">


Material Design Ripple Click Tap Effect In Vue

Download Details:

Author: partyka1

Live Demo:

Download Link:

Official Website:

Install & Download:

You Might Be Interested In:

Add Comment