Magic UI
A free library of pre-built, animated building blocks for websites — instead of a developer hand-coding a fade-in effect or a particle background from scratch, they copy a ready-made component into their project and adjust it, the same way people already
🔗 Visit Magic UI
Description
Building a polished, animated website from scratch is slow: every subtle motion effect, gradient border, or particle background has to be hand-coded, tested across browsers, and tuned until it feels right. Magic UI shortcuts that by giving developers over 150 of these effects already built — you copy the code straight into your project (no package to install, no dependency to manage) and adjust the colors or timing to fit.
Magic UI is an open-source, MIT-licensed library of 150+ animated UI components built with React, TypeScript, Tailwind CSS, and Motion (Framer Motion's successor). It deliberately follows the same copy-paste philosophy as shadcn/ui — components live in your codebase, not behind an npm dependency, so you own and can modify the code directly. It has over 21,000 GitHub stars and is used in the marketing sites of several YC-backed startups. A one-time $199 Pro purchase unlocks 50+ additional premium components and 8 production-ready landing page templates for teams who want to skip building a marketing site's visual polish from scratch.
💬 Our review
The short version: if your team already uses shadcn/ui for its component base and wants animated flourishes (hero sections, marquees, particle effects) without hand-rolling them, Magic UI is close to a no-brainer — it's free, open source, and drops straight into the same workflow.
The closest comparison is Aceternity UI, which covers similar ground (animated, copy-paste React components) — Magic UI's edge is a larger component count, more GitHub traction (21.7k stars), and a cheaper one-time Pro price ($199 flat vs. subscription models elsewhere). Because components are copied rather than installed as a dependency, there's no risk of a breaking upstream update, but it also means you won't get automatic bug fixes — a fair trade for teams that want full control over the code. For a marketing site or dashboard that needs to look polished fast without a dedicated designer, it's genuinely hard to beat at $0.
💰 Pricing
📊 Global score
🤖 AI-enriched data
Free : 150+ composants open source, licence MIT. Pro : $199 paiement unique, 50+ composants premium + 8 templates de landing pages.
Pros
150+ composants animés gratuits, licence MIT
Philosophie copier-coller (même approche que shadcn/ui), pas de dépendance npm
21 700+ étoiles GitHub, adopté par des startups YC
Version Pro à $199 en paiement unique (pas d'abonnement)
Cons
Composants copiés = maintenance manuelle en cas de mise à jour de la lib
Concentré sur l'esthétique/animation, pas un design system complet
Version Pro nécessite un paiement séparé pour les templates avancés