MiniDev UI vs Magic UI: which should you use?
Facts checked September 30, 2026
At a glance
| Feature | MiniDev UI | Magic UI |
|---|---|---|
| Price | Free, everything | Free open source components; paid Magic UI Pro for templates and sections |
| License | MIT | Open source (see LICENSE.md in the repo); Pro has its own terms |
| Scope | Over 500 items: roughly 375 UI components, 86 motion components, 43 blocks and pages | 150+ free animated components and effects: text animations, backgrounds, marquees, device mockups, buttons and more |
| Blocks | App and marketing pages: billing, settings, sign in, analytics, chat, pricing, heroes | 50+ blocks and templates for landing pages in Magic UI Pro (paid) |
| Templates | 8 landing page templates shown as live demos, with brand kits (not downloadable as whole apps) | Landing page and site templates, offered through Magic UI Pro |
| Primitives | Base UI (@base-ui/react) | Designed to sit next to shadcn/ui, which supplies the primitives |
| Animation | motion (the Framer Motion successor) | motion (Framer Motion) and CSS animations |
| Tailwind version | Tailwind CSS v4 | Tailwind CSS; follows the shadcn/ui setup, check docs for version notes |
| Install | npx shadcn@latest add https://ui.minidev.pro/r/<name>.json, or npm minidev-ui-kit | shadcn CLI, or copy and paste |
| Theming | Semantic OKLCH tokens, materials (hairline, glass, metal, paper), one light source for shadows | Uses the shadcn/ui CSS variables plus per-component props for colors and timing |
| Dark mode | Yes, from the same token set | Yes, through the shadcn/ui theme |
| AI tooling | llms.txt and llms-full.txt; shadcn MCP compatible | Official Magic UI MCP server for AI editors |
What each one is
Magic UI describes itself as a UI library for design engineers: animated components and effects you copy and paste into your app, free and open source. It is built with React, TypeScript, Tailwind CSS and motion, and it is designed as a companion to shadcn/ui, so you install pieces with the shadcn CLI. A separate paid product, Magic UI Pro, sells ready made sections and templates.
MiniDev UI is a free, MIT licensed shadcn-compatible registry of over 500 items built on Base UI, Tailwind CSS v4 and motion. Its focus is the product: data tables, billing and invoice screens, settings layouts, command palettes, notification centers and AI chat surfaces, along with full-page blocks and about 86 motion components. All of it draws from one set of semantic tokens.
Where Magic UI shines
- Small, delightful details. Animated text, number tickers, marquees, borders and backgrounds that add polish without taking over the page.
- Easy to adopt. It follows the shadcn/ui conventions closely, so it slots into an existing shadcn project with little friction.
- AI editor support. An official MCP server lets tools like Cursor and Claude search and install Magic UI components directly.
- Large community. It is widely used alongside shadcn/ui, so examples and answers are easy to find.
Where MiniDev UI shines
- Application screens. Tables, forms, overlays, charts, billing, auth, settings and AI chat, built on accessible Base UI primitives.
- No paid tier. Blocks, motion pieces and full pages are all MIT.
- A visual system. One light source drives shadows across the page, and a
data-materialattribute switches between hairline, glass, metal and paper. - Full pages. About 43 blocks, from a sign in page to an admin console, so you start with a working screen.
Using them together
Both are shadcn registries and both use motion, so they fit in one project without a second animation runtime. A useful split is MiniDev UI for the app shell, forms and data, and Magic UI for a few animated details on the marketing pages, such as a text effect in the hero or a logo marquee.
Magic UI components read the standard shadcn/ui variables. The MiniDev stylesheet maps those names (--background, --foreground, --primary, --muted and others) to MiniDev tokens, so Magic UI pieces generally pick up your MiniDev theme and dark mode. One name differs in meaning: MiniDev's accent is the brand violet, where shadcn/ui treats accent as a subtle fill, so review any component that uses it.
Install notes
npx shadcn@latest add https://ui.minidev.pro/r/settings-page.json
After adding MiniDev items, import the tokens after Tailwind in your global CSS with @import "minidev-ui-kit/styles.css";, or copy styles.css from any component's docs page. Magic UI components are added with the shadcn CLI as described in their docs. Both libraries put the source in your repo, so you can edit anything after install.
Magic UI Pro pricing can change. Check pro.magicui.design for current plans.
Which to pick
- Choose Magic UI if your project already runs on shadcn/ui and you want a few animated touches, such as a shimmering button, an animated headline or a logo marquee, with minimal setup.
- Choose MiniDev UI if you need application screens (tables, billing, settings, chat) and page blocks that share one visual system, with no paid tier to consider.
- Choose both if you are building a product and its marketing site at the same time. They share the shadcn CLI and the motion dependency, so the cost of combining them is low.
Frequently asked questions
Is Magic UI free?
Yes, the component library is free and open source. Magic UI Pro, a separate product with templates and sections, is paid. MiniDev UI has no paid tier.
Do Magic UI and MiniDev UI use the same animation library?
Both use motion, the successor to Framer Motion, so they can share one dependency in the same project.
Which one should I use for a dashboard?
MiniDev UI, since it includes data tables, charts, settings and dashboard blocks. Magic UI can add animated details, such as number tickers, on top.
Can AI coding tools install both?
Yes. Magic UI has an official MCP server. MiniDev UI publishes llms.txt and a shadcn registry that the shadcn MCP server and CLI can read.
Sources
Magic UI is a trademark of its owner. This page is our own summary, checked on September 30, 2026. Pricing and features change, so confirm on their site.