@tasteink/glitch-styles v0.0.5-development

NOTE: Not ready for usage yet. Hang tight.

1. Install it.

yarn add @tasteink/glitch-styles

2. Add the following CSS variables, tuned to your liking.

:root {
  --glitch-vertical-offset-left: -0px;
  --glitch-vertical-offset-right: 0px;
  --glitch-left-width: -2px;
  --glitch-right-width: 2px;
  --glitch-color-0: #10f6be;
  --glitch-color-1: #ff51ce;
  --glitch-blur: 1px;
}

3. Import the css file from @tastink/glitch-styles.

<link rel="stylesheet" href="/path/to/@tastink/glitch-styles.css" />

4. Use the provided class names.

<div class="boxGlitch">...</div>
<p class="textGlitch">...</p>

5. Get this kind of effect: