About 130 hand-crafted animated React components built with Tailwind CSS v4 — text effects, backgrounds, cards, widgets and bento grids — installed with the shadcn CLI.
components
animata.design
Visitopens in a new tab
23rd
23rd.dev
A shadcn/ui registry of opinionated React components, from WebGL shaders and animated backgrounds to footers, 404 pages and a gooey colour picker, installed by CLI so you own the code.
What is 23rd?
23rd distributes its components through the shadcn CLI, either as pnpm dlx shadcn@latest add @23rd/shader-gradient or from the public GitHub registry, which copies the source into your project instead of adding a runtime package. Categories include shaders (gradient, metal, sky, anime fire), backgrounds (Radiant Lines, Logo Burst, ASCII Fluid, Ring Tower, Iso Lattice), characters such as Live Orb and ASCII Logo, a stretchy footer, dithered and snake 404 pages, and experiments like Phosphor Score and Typewriter.
The documentation explains placement for backgrounds and shaders: wrap them in a relatively positioned container and keep content in a later stacking context, with a use client directive on the consuming component. The project is maintained on GitHub at radiumcoders/23rd.dev and is described there as an open source library of tasteful web components.
Best for
- Adding a WebGL shader hero to a React app without writing GLSL
- Giving 404 pages, footers or loading states a distinctive treatment
- Extending an existing shadcn/ui project with decorative components
Key features
- Installed with the shadcn CLI from the @23rd registry or GitHub
- Shader components including gradient, metal, sky and anime fire
- Background components such as Radiant Lines, ASCII Fluid and Iso Lattice
- Smaller pieces like Gooey Colour Picker, Phosphor Score and Typewriter
- Built with React and Tailwind CSS, with WebGL shaders where needed
Related resources
Animate UI replaces shadcn/ui primitives with animated versions built on Radix UI, Base UI and React Aria, driven by Motion.
components
animate-ui.com
Visitopens in a new tab
Library of live animated UI components for the web and SwiftUI, where each entry plays in the browser and its code can be copied straight into a project.
components
bluma.design
Visitopens in a new tab