How to add Glitch effect on text/images/SVG?


@mixins to make working with it a bit easier.

If you are interested in this, then Lucas Bebber's Glitch is a very similar and super cool effect:

enter image description here

Created using a simple SASS Mixin such as

.example-one {
  font-size: 100px;
  @include textGlitch("example-one", 17, white, black, red, blue, 450, 115);

More details at Chris Coyer's CSS Tricks and Lucas Bebber's Codepen page