Free
150+ animated components
Copy-paste marquees, bento grids, globes, beams, text effects and buttons — MIT licensed and built on shadcn/ui conventions.
UI library for design engineers
Magic UI: landing pages that move, built from copy-paste components
150+ free, MIT-licensed animated components for React, Tailwind CSS and Motion, made to sit next to shadcn/ui. Magic UI Pro adds 50+ page sections and 9 templates for one payment of $199 — no subscription, and every future template is included.
Get Magic UI Pro — $199 lifetime
one-time purchase on pro.magicui.design, opens in a new tab
Browse free components
- 21k+ GitHub stars, MIT licensed
- 150+ free animated components and effects
- Trusted by 5,000+ developers (Pro)
magicui.net earns a commission on Pro purchases made through its links — at no extra cost to you.
npx shadcn@latest add @magicui/bento-grid
Install guide →
What is Magic UI?
Magic UI (also written magicui) is a UI library for design engineers: 150+ animated components and effects (the official docs publish 76 component pages; the larger count includes variants) — marquees, bento grids, globes, beams, text effects, buttons — built with React, TypeScript, Tailwind CSS and Motion, released under the MIT license and installed with a single command through the shadcn registry. The free library is the whole component set; Magic UI Pro adds 50+ page sections and 9 templates for a one-time $199. It is made for developers who already work with shadcn/ui and want motion without hand-writing every animation.
This site is the magicui.net resource hub for Magic UI components: how to install Magic UI in Next.js 15 or Vite, how the Magic UI MCP server works in Cursor and Claude Code, what Magic UI templates include, and clear answers on pricing and licensing — with every component linking to its official documentation page.
Everything a landing page needs to move
Four building blocks — free components, templates and Pro sections, the MCP server and CLI, and a modern React stack — cover the whole path from empty repo to shipped page.
Free + Pro
Templates & Pro page sections
9 templates (startup, SaaS, portfolio, AI agent, dev tool, mobile, Codeforge, changelog, blog) and 50+ page sections — ship a landing page in hours, not weeks.
Free
MCP server + CLI
Search and install components from your AI editor with the official Magic UI MCP server — the CLI writes the config for Cursor, Windsurf, Claude Desktop, Cline and Roo Cline; Claude Code and VS Code use the same short JSON.
Free + Pro
Built for the modern stack
React 19, Next.js 15, Tailwind CSS v4 and Motion; TypeScript-first with dark mode out of the box — and it imports cleanly into v0, Lovable and Replit.
Six component families. One install command each.
Pick a family, copy the component, paste it into your project — every component links to its official docs page and works with the Magic UI MCP server in Cursor, Claude Code and Windsurf. See the full component and template overview.
Text effects
Headlines and labels that type, morph, sparkle, flip and rotate.
Backgrounds & patterns
Grids, dots, warps, rays and particles that sit behind heroes and sections.
Buttons
Calls to action with shimmer, rainbow, ripple, pulse and hover states.
Cards & layout
Bento grids, marquees, docks, file trees, terminals and cards for feature sections.
Device mockups
Browser and phone frames for screenshots and demos.
Special effects
Globes, beams, borders, cursors, reveals and playful extras.
Magic UI Pro: 50+ sections and 9 templates, one payment
Magic UI templates cover the pages design engineers actually ship — startup, SaaS, AI agent, dev tool, mobile app, portfolio, Codeforge, changelog and blog — and the Pro section library adds headers, heroes, social proof, feature blocks, pricing tables, CTAs, FAQs and footers you assemble like the free components. Pro is $199 one-time payment with lifetime access and updates; single templates are $49 each. See the full breakdown on the Magic UI pricing page.
- Lifetime access and lifetime updates — no subscription
- Commercial use for client and company projects
- Installed through the same shadcn registry flow as the free library
Why teams pick Magic UI
- 21k+ GitHub stars, MIT licensed — source
- 150+ free animated components and effects — source
- Trusted by 5,000+ developers (Pro) — source
- Show HN, May 2024 — source
- Used on landing pages by YC-backed startups such as Infisical, Langfuse and Million — source
Star count and component totals are read from the official GitHub repository and homepage and refreshed when they change.
Start free, upgrade when a template would save you a week
The free library never expires. When you need a full landing page or the Pro section kit, Magic UI Pro is a single $199 payment — no renewals, and every future template is included.