How does this work with AI?

This is where the library shines. AI agents are great at wiring logic and terrible at inventing tasteful visuals, so you hand them ours. Every component and block is plain React and Tailwind that Cursor, Claude Code, v0, Bolt.new, Lovable, and similar tools can read, remix, and extend without friction. We also ship a SKILL.md file that teaches your agent the whole library, so it knows what exists and installs the right pieces on its own. Your agent stops producing generic AI-looking pages and starts composing from hundreds of hand-crafted, animated building blocks.

Is it a subscription?

You have two options. Lifetime is a one-time payment for permanent access, including every future update we ship. Annual is a yearly subscription: cancelling stops the next renewal but you keep full access for the rest of the period you paid for. Either way, everything already in your project stays there permanently. No seat fees, no expiring licenses on code in your codebase.

Can I use it on client work and SaaS?

Yes. One license covers one developer for unlimited commercial projects, including client work and your own products. The only thing you can't do is repackage and resell the code as a competing component library or template.

How often do you release new things?

Every month. New components, new blocks, and occasionally new templates. Lifetime customers get every update at no extra cost; annual subscribers get all updates for the duration of their subscription. Your library grows automatically.

What stack does it use?

Next.js 16, React 19, TypeScript, and Tailwind CSS 4. Some components use motion/react, GSAP, or Three.js where the visual effect calls for it, and each docs page lists its dependencies. It's built specifically for React, so the components won't run as-is in Vue or Svelte, but you're welcome to use the design and CSS as a reference for porting to your own projects.

What's the refund policy?

All sales are final, and this applies to both lifetime and annual purchases. Every component has a live preview and full documentation, and the docs site is open to browse before you buy, so please review them first to make sure the library fits your needs.

How do I install components after I buy?

Log in with the email you used at checkout and you'll have instant access to the docs, code, and CLI for your tier. Install with the shadcn CLI or copy and paste straight into your project.

Is there support if I get stuck?

Yes. Bug reports are handled across all tiers. Ultimate customers get priority email support for questions and edge cases.

Can I upgrade, transfer, or buy for a team?

Yes to all three. Email pro@reactbits.dev from your original purchase email: we'll send an upgrade link for the difference between tiers, handle reasonable license transfers and email changes, and put together volume pricing for teams. Each license covers one developer across unlimited projects.

80 new blocks

Impactful UI.
Yours forever.

Animated components, blocks, and templates, crafted for humans and structured for AI agents. The sharpest way to ship pages that stick.

Get Lifetime Access Browse Everything

Trusted by developers worldwide

pro.reactbits.dev

350+ assets inside

Built for launches that stand out.

Production-grade animated UI for the kind of work that gets remembered.

Explore the library

Navbar

Hero

Bento grid

Pricing

Testimonials

CTA

Footer

Modal

100+ Components

Ship weeks of work in an afternoon

Components, blocks, full templates. The full launch in a single library.

Production-ready

Typed, 60fps, designed to impress — installable by you or your AI agent in one command.

amplitude

tone

Tuned to your brand

Typed props give full control.

320

320px to 4K

Sharp on every screen.

The creative arsenal for AI.

Your agent is only as good as what it builds with. Hand it assets with taste and it stops shipping pages that look generated.

Works in any workflow

The registry speaks shadcn, so Cursor, Claude Code, or Copilot installs any asset with one command.

Skills built in

An agent skill ships with the library, so your AI knows every asset and exactly how to use it.

Code you own

Everything lands in your repo as plain React and Tailwind. No lock-in, no runtime, nothing to unlearn. Edit anything.

Launch in days, not months.

Production-ready Next.js templates. Clone, customize, ship.

View all templates

Saas

Vibrant landing page for SaaS products with rounded frame and modern animations

Minimal

Clean minimal landing page with WebGL shader cursor and smooth animations

Agency

Creative agency landing with WebGL effects, GSAP animations, and smooth scrolling

Finance

Professional fintech landing with 3D backgrounds, animated stats, and trust signals

AI SaaS

AI product landing with WebGL fluid cursor, GSAP animations, and image bulge effects

Shader

Bold landing page with full-screen WebGL shaders, fluid color gradients, and immersive scroll-driven scenes

Wireframe

Architectural landing page with wireframe 3D models, technical typography, and blueprint-inspired layouts

Portfolio

Free personal portfolio template with smooth animations, project case studies, and a minimal aesthetic

8 Bit

Retro pixel-art landing page with pixel effects, a WebGL globe, and an 8-bit flame shader

AI App

Minimal landing page with scroll-driven set pieces, a WebGL hero, and a pinned phone walkthrough

Security

Dark-first editorial landing page with a WebGL curtain reveal, ASCII art, and chamfered UI

Saas

Vibrant landing page for SaaS products with rounded frame and modern animations

Minimal

Clean minimal landing page with WebGL shader cursor and smooth animations

Agency

Creative agency landing with WebGL effects, GSAP animations, and smooth scrolling

Finance

Professional fintech landing with 3D backgrounds, animated stats, and trust signals

AI SaaS

AI product landing with WebGL fluid cursor, GSAP animations, and image bulge effects

Shader

Bold landing page with full-screen WebGL shaders, fluid color gradients, and immersive scroll-driven scenes

Wireframe

Architectural landing page with wireframe 3D models, technical typography, and blueprint-inspired layouts

Portfolio

Free personal portfolio template with smooth animations, project case studies, and a minimal aesthetic

8 Bit

Retro pixel-art landing page with pixel effects, a WebGL globe, and an 8-bit flame shader

AI App

Minimal landing page with scroll-driven set pieces, a WebGL hero, and a pinned phone walkthrough

Security

Dark-first editorial landing page with a WebGL curtain reveal, ASCII art, and chamfered UI

Skip the blank canvas.

238+ ready-made sections. Responsive, animated, ready to ship.

Browse all blocks

Loading preview…

Hero

hero-1 — Editorial hero with bold typography, animated entrance, and a clear primary CTA.

View category

The math that matters.

Pay $299 once. Whether you build by hand or with AI, the numbers add up.

Time you don't spend building

0+ hours

What this means

10+ months of senior design and dev work

$150K+ in opportunity cost

Every asset QA'd, responsive, accessible

Return on investment

How you benefit

Pay $299 once, skip 350+ build cycles

Worth up to 500x what you pay

Lifetime updates included, no renewals

What building it yourself costs

Senior designer, 4 months$52,000

Senior developer, 6 months$84,000

QA, accessibility, cross-browser passes$12,000

Total$148,000

What it costs with React Bits Pro

$299, once.

Get lifetime access

Based on hiring a designer and developer at market rates to build all 350+ assets from scratch.

Don't take our word for it.

Over 1,000 developers already own it. Here's why.

Follow along on X

“Everything about this is next level.”

shadcn@shadcn

“A product so well crafted that it becomes an instant classic in your stack? My last one is React Bits.”

Dany@MajorBaguette

“A sleek, minimal, and super dev-friendly React component library. Clean UI, easy to use, and perfect for modern projects.”

Tanmay@syskey_dmg

“@davidhdev is cooking some of the most beautiful components I have ever seen with React Bits.”

Justine Chang@justine_chang39

“Literally the coolest library for React.”

Rui@Logreg_n_coffee

“React Bits: A stellar collection of React components to make your landing pages shine ✨”

Greg Bergé@gregberge_

Pay once. Ship forever.

350+ components, blocks, and templates. New drops every month, included in your license.

Starter

Every component we've ever made. For devs who want world-class animation without writing it.

$99one-time payment

100+ animated components
Tailwind & vanilla CSS variants
Production-ready TypeScript
One-command install, works with Claude Code & Cursor
Every future component, free
Commercial license, unlimited projects

Get Starter

Pro

Components plus every page block. Stop assembling sections, paste finished ones.

$199one-time payment

Everything in Starter
238+ pre-built page blocks
21 categories: heroes, pricing, FAQs, footers, more
Designed to mix, consistent across categories
Every future block, free

Get Pro

Ultimate

Common questions.

Not covered here? Reach out and we'll help.

pro@reactbits.devPriority replies for Ultimate customers See the roadmapWhat we're shipping next

Starter: 100+ animated React components. Pro: everything in Starter, plus 238+ pre-built UI blocks across 21 categories (hero, pricing, FAQ, CTA, and more). Ultimate: everything in Pro, plus 10 full landing-page templates and priority email support. Every tier ships with TypeScript, Tailwind CSS, full responsiveness, and light/dark mode.