Skip to main content

Updated: Glitch Text

By Steven Van ·

Glitch Text in React Bits gets four glitch styles, adjustable intensity, skew and flicker options, and short bursts that play on click.

Glitch Text in React Bits now offers four glitch styles. Per the component page, the options are sliced bands, a jittering color split, a scanning tear and swapped glyphs.

Controls

  • Intensity: set how hard the text glitches.
  • Skew and flicker: both can be added to the effect.
  • Click bursts: short glitch bursts can play when the text is clicked.

Installation

The page offers JavaScript or TypeScript, with plain CSS or Tailwind. The TypeScript and Tailwind version installs with npx shadcn@latest add @react-bits/GlitchText-TS-TW. The interactive preview, customization controls and source tabs need JavaScript enabled.

React Bits
React Bits
An open-source collection of 200+ animated, interactive React components and micro-interactions.
View React Bits →
Sources

Original source

Read Updated: Glitch Text on Creators Toolbox