The next-generation React animation & UI component platform.
Atomic. Performant. Visually aggressive.
ReactAtoms is a high-performance, animation-first React component system built for modern interfaces.
It's not a UI kit.
It's not a design system.
It's a motion-driven component engine designed for:
- landing pages
- SaaS dashboards
- creative portfolios
- next-gen web experiences
Every component is atomic, copy-pasteable, and independent.
No wrappers.
No lock-in.
No bloat.
Most UI libraries:
- look the same
- animate poorly
- hide logic behind abstractions
ReactAtoms is different.
We focus on:
- motion physics
- visual depth
- interaction feedback
- developer control
If you care about how things feel, not just how they look — this is for you.
Each component works standalone.
Use one, use ten, or use all — your call.
Entropy decoding, magnetic focus, glitch distortion, aurora plasma, cinematic reveals.
Canvas-based particles, gravity wells, fluid orbits, grid warping, noise & meshes.
Buttons, toggles, cards, hover states, loading effects — all motion-aware.
Built on Framer Motion with real physics (springs, inertia, damping).
Strict typing. Predictable APIs. Editor autocomplete that actually helps.
Fully customizable via utility classes — no fighting the library.
ReactAtoms components are dependency-light and framework-agnostic.
npm install framer-motion clsx tailwind-mergeNo custom CLI.
No package lock-in.
Copy only what you need.
import { FluxText } from "@/components/text/FluxText";
export default function Hero() {
return (
<FluxText
text="ReactAtoms"
intensity={0.8}
hover
/>
);
}Text Animations
- Quantum Focus
- Flux Text
- Aurora Text
- Mist Reveal
- Glitch / Typewriter / Wave
Backgrounds
- Orbital Fluids
- Grid Vortex
- Gradient Mesh
- Noise Fields
UI Components
- Glass Cards
- Toggles & Switches
- Progress Indicators
- Interactive Buttons
Motion Effects
- Hover physics
- Scroll-based reveals
- Entrance animations
New components ship continuously.
What you get:
- Live previews (not static screenshots)
- Real component playgrounds
- Copy-paste code
- Customization controls
- Usage patterns & best practices
No global styles
No magic providers
No runtime overhead
No opinionated layout rules
ReactAtoms fits into your stack — not the other way around.
We actively welcome contributions.
You can:
- fix bugs
- improve animations
- add new components
- optimize performance
- improve docs
Read 👉 CONTRIBUTING.md before submitting PRs.
Found a vulnerability?
Please follow the responsible disclosure process in SECURITY.md.
MIT License — free for personal and commercial use.
See LICENSE for details.
ReactAtoms is created and maintained by
Anish Raj
GitHub → https://github.com/anish-devgit
Built for developers who care about motion, detail, and experience.
⭐ If ReactAtoms saves you time, consider starring the repo!