1[![Build status](https://travis-ci.org/PolymerElements/paper-ripple.svg?branch=master)](https://travis-ci.org/PolymerElements/paper-ripple) 2 3##<paper-ripple> 4 5Material design: [Surface reaction](https://www.google.com/design/spec/animation/responsive-interaction.html#responsive-interaction-surface-reaction) 6 7`paper-ripple` provides a visual effect that other paper elements can 8use to simulate a rippling effect emanating from the point of contact. The 9effect can be visualized as a concentric circle with motion. 10 11<!--- 12``` 13<custom-element-demo> 14 <template> 15 <script src="../webcomponentsjs/webcomponents-lite.js"></script> 16 <link rel="import" href="paper-ripple.html"> 17 <style is="custom-style"> 18 div { 19 height: 100px; 20 width: 100%; 21 box-shadow: 0 12px 15px 0 rgba(0, 0, 0, 0.24); 22 } 23 24 paper-ripple { 25 color: #4285f4; 26 } 27 </style> 28 <next-code-block></next-code-block> 29 </template> 30</custom-element-demo> 31``` 32--> 33```html 34<div style="position: relative"> 35 <paper-ripple></paper-ripple> 36</div 37``` 38 39 40 41