woglabs.

React Bits

Find animated React components, backgrounds and micro-interactions, with live controls and JavaScript or TypeScript source.

By David HazComponent libraryMIT + Commons Clause

See what’s inside

Explore live components
The official React Bits showcase featuring interactive text, glass effects, cards, galleries and animated backgrounds.
Animated components and backgroundsThe official free-library README showcase, not the separate React Bits Pro package.

Official React Bits README showcase by David Haz. Resized to WebP, with no content changes. Source uses MIT + Commons Clause; the complete notice is linked below. Source & credits

Choose an effect, then bring its source into your React project

React Bits is a component library for React and Next.js. Browse the live examples, tune their controls and choose a code variant. Agents can discover components through the documented registry and MCP integration.

  • Browse text animation, components, backgrounds and small interface interactions.
  • Choose JavaScript or TypeScript, with CSS or Tailwind styling.
  • Use live controls to understand how an effect responds before adding it.
  • Let compatible agents work with the component registry through the documented shadcn MCP flow.

Before you start

  • A compatible React or Next.js project; individual components may require additional dependencies.
  • The public repository is a component library and does not ship a general SKILL.md installer.
  • Paid React Bits Pro skills and assets are a separate product, not included in this listing or source download.

Set it up for your workflow

Run this in your React project after reviewing the official installation guide and configuring the registry as needed. Review the files and dependencies it adds.

  1. Open a live component demo, try its controls and choose a JS/TS and CSS/Tailwind variant.

  2. Use the documented CLI or copy the component source into your own project.

  3. Check reduced motion, accessibility and rendering cost in the actual interface where you use it.

Read the official README

License and source

React Bits uses MIT + Commons Clause, not unrestricted MIT. The current notice permits use within applications, websites and products, while restricting redistribution of components, tools, sounds or standalone exports. WOG Labs links the author’s official source download and does not repackage the library or Pro assets. Read the complete upstream terms for your use.

WOG Labs reviewed the linked repository and its documented download options. The previews come from the identified upstream sources; installation and generated results have not been independently reproduced here.

Read the original licenseBrowse the source revision