Skip to main content
ParticleUI
Sign inGet started free
100+ components — React · Svelte · Vue · MIT · Open source

Components so good
your users stop scrolling

100+ animated components for React, Vue, and Svelte — particle effects, full-page blocks, and OKLCH design tokens. One command install. MIT licensed and free to start.

Browse free componentsGet Pro — $149 →
★★★★★5.0 · Loved by 200+ developers · MIT licensed
bash
$npx particleui-cliadd glow-card
✓ glow-card
✓ Installing dependencies...
✓ Wrote src/components/ui/glow-card.tsx
100+Components
3Frameworks
0Runtime deps
MITLicense
100+ components · React · Vue · Svelte
Particle HeroPro
Glow Button
Magnetic Button
Aurora BackgroundPro
Border Beam
Spotlight
Shimmer Button
Tilt Card
Cursor TrailPro
Orbit AnimationPro
Glow Card
Meteors
Hero Section
Bento GridPro
Beam
Gradient Text
Pricing Section
Spotlight HeroPro
Ripple
Marquee
GlobePro
Word Rotate
Floating Dock
Auth Flow
Live preview

See them move

These are real components running in the browser. Hover, click, interact.

Magnetic Button

Follows your cursor with spring physics

Pro

Glow Button

Three variants with pulsing light

Free

Gradient Card

Animated border gradients

Free
Pro

Particle Hero

Full-viewport canvas particle system. Move your cursor on the live page to see it react.

View component
Live statusIdleOffline

Electric Badge

Animated pulse for status

Free
Why ParticleUI

Built different

Zero new tools

One command. Components land in your codebase.

No proprietary CLI, no wrapper package, no runtime imports. Components land directly in your codebase. Modify them, delete them, own them.

$ npx particleui-cli add glow-button
✓ Wrote src/components/ui/glow-button.tsx
Exclusive

AI knows your components

Every Pro component ships a Claude skill. Your AI assistant understands every prop, every edge case, every customisation.

~/.claude/skills/particle-hero/
~/.claude/skills/magnetic-button/

React · Vue · Svelte

Same OKLCH design tokens. Three registries. One install.

React
Vue
Svelte

MCP server included

Let Claude search and install your components from inside any conversation.

claude mcp add @particleui/mcp

$149, once. Forever.

No subscription. No per-seat. Every component we ever ship, yours.

See pricing
Beyond components

ParticleUI is a platform

Not just a component library. A complete UI toolkit with an AI generator, live theme studio, templates, and multi-framework support.

AI UI Generator

Describe any page in plain English. Get a live preview assembled from real ParticleUI blocks, plus a one-command install.

Prompt: "A SaaS landing page for a project management tool targeting remote teams"
→ hero-split + logo-cloud + feature-alternating + pricing + faq + footer
Try the generator

Live Theme Studio

Tweak OKLCH design tokens with real-time preview. Export your theme as CSS, share a registry URL, or save to your account.

Espresso
Ocean
Forest
Cyber
Open Theme Studio

Full-page Templates

6 composed page templates — landing, SaaS dashboard, auth flow, pricing, docs, blog. Install every block in one command.

$ npx particleui-cli add landing
✓ Installed 9 blocks
Browse templates

React · Vue · Svelte

100+ components across React, Vue 3, and Svelte. Same API, same design tokens, same CLI install. Switch the registry URL and you're done.

react/r/react/{name}.json
vue/r/vue/{name}.json
svelte/r/svelte/{name}.json
Developer first

Setup in 60 seconds.
Customise forever.

Add the registry to your components.json. Run the install. The source is yours — edit every line, every prop, every style.

  • You own every line of source code
  • MIT licensed — use in any project
  • TypeScript-first, full type safety
  • No runtime deps you don't already have
components.json
{
  ...
  "registries": {
    "@particleui": {
      "url": "https://particleui.dev/r/react/{name}.json"
      "headers": {
        "Authorization": "Bearer ${PARTICLEUI_TOKEN}"
      }
    }
  }
}

5.0 · Loved by 500+ developers

Loved by builders

"Shipped our entire dashboard redesign in a weekend. The particle hero alone is worth ten times the price."

A

Alex K.

Frontend Lead · Linear

"My landing page conversion went up 40% after switching. Investors keep asking who designed it."

M

Maya R.

Founder · Indie Hacker

"The Claude skills bundled with each component are a game changer. AI customisation just works."

T

Tom B.

Full-stack Dev · Freelance

"I've tried every component library out there. ParticleUI is the only one I never uninstalled."

S

Sara J.

Design Engineer · Vercel

"My users literally message us to ask about our UI. I just say 'ParticleUI' and they go look it up."

D

Dev P.

CTO · YC S23

"Vue + Svelte support sealed it. My work project (React) and side project (Vue) both use it now."

C

Chris W.

Product Engineer · Stripe

Pricing

One price. Everything. Forever.

No subscriptions. No per-seat. No games.

Free

$0

Free components, always free.

Get started

Includes

  • 55+ core primitives (MIT)
  • 36 particle effects
  • 20 full-page blocks
  • particleui-cli included
  • Community support

Pro

$149one-time

Lifetime access. No expiry.

Buy lifetime access →

Everything in Free, plus

  • 50+ components, forever
  • React + Vue + Svelte registries
  • Full page blocks & templates
  • Bundled Claude skills per component
  • ParticleUI MCP server
  • Lifetime updates
  • Priority support

FAQ

Common questions

Is this really a one-time payment?
Yes. $149 once, yours forever. No monthly fees, no renewal reminders. Every component added in the future is included.
How is this different from shadcn/ui?
shadcn/ui gives you great primitives. ParticleUI adds the particle and animation layer, full-page blocks, OKLCH design tokens, and native Vue + Svelte registries — all with a strong visual identity out of the box.
Do components work with my existing stack?
Yes. Components install as source files into your project — no runtime package, no version lock-in. They work alongside anything else in your codebase.
What frameworks are supported?
React, Vue 3, and Svelte 5 — all native implementations, not ports. The CLI auto-detects your framework.
What if I need a refund?
14-day no-questions-asked refund. Email us within 14 days of purchase and you'll get a full refund.
Can I use Pro components on client projects?
Yes. One Pro license covers unlimited personal and commercial projects. Components land in your codebase — your client never needs to know or pay.

Still have questions? Read the docs or email us.

Your users deserve
the best UI alive

Start with free components today. Upgrade when you're ready to blow minds.

Start building freeSee pricing
ParticleUI — 100+ UI components with particle effects | ParticleUI