KraavonUI
Free & open source

Animated React components
ready to ship.

53+ production-ready components for React and Next.js. Copy the code, paste it in, done.

Browse componentsGitHub
53+
Components
Free
Open source
React & Next.js
Compatible
3D & shaders
Included
BackgroundsText effectsButtonsCards3DNavigation

Components

53 components,
ready to copy.

Browse all →
Soft Aurora
Particle Field
Mesh Gradient
Dot Grid
Light Beam
Typewriter
Scramble Text
Split Text
Gradient Text
Count Up
Magnetic Button
Ripple Button
Glow Button
Shine Button
Tilt Card
Flip Card
Glow Card
Spotlight Card
Floating Sphere
Wave Plane
Particle Cloud
Spinner
Dots Loader
Morphing Blob
Animated Tabs
Dock
Floating Nav
Stars Background
Grid Background
Shader Gradient
Glitch Text
Word Rotate
Blur Reveal
Morphing Text
Gradient Border Button
Spotlight Button
Glass Card
Neon Card
Bento Grid
Torus Knot
Ring Loader
Progress Bar
OTP Input
Password Strength
Toast Notification
Vortex Background
Aurora Text
Holographic Card
Cursor Trail
Animated Beam
Magnetic Text
Liquid Button
Noise Background
See all components

How it works

Three steps to shipped.

01
Browse

Find a component you need. Preview it live, check the code, see what dependencies it requires.

02
Copy or install

Use the shadcn CLI to drop it directly into your project, or copy the source and paste it in.

03
Ship

Every component is production-ready. No wrappers, no config - just working React code you own.

Add a component in seconds.

Use the shadcn CLI to install any component directly into your project. No registry account, no signup - just run and go.

$ npx shadcn@latest add https://ui.kraavon.com/r/mesh-gradient.json
Browse all components →