Yes, its 150+ animated components and effects are free and open source. Magic UI Pro is a separate offering with 50+ blocks and templates.

Does it work with shadcn/ui?

The site describes Magic UI as a perfect companion for shadcn/ui.

Where is the source code?

The source code is available on GitHub.

Magic UI

React component library for design engineers. 100% open-source, and customizable.

Category:

Design Assets

Maker:

Dillion Verma

Pricing

Free

Skill Level

Developer

Use Cases

Portfolio

⚡️ Tags detected by AI

46 visitors went to Magic UI from LandinTools in the last 30 days.

Your product? Claim it to see where they come from

About Magic UI

Magic UI is a UI library aimed at design engineers, offering more than 150 free and open-source animated components and effects. The components are built with React, TypeScript, Tailwind CSS and Motion, and the project positions itself as a companion to shadcn/ui. Recent additions highlighted on the site include a Floating 3D Particles effect.

Beyond individual components, Magic UI provides templates for building landing pages, and a paid tier called Magic UI Pro adds more than 50 blocks and templates intended to help assemble landing pages quickly. The site includes component browsing, templates, a showcase of sites built with the library, and searchable documentation.

The showcase lists a mix of startups, open-source projects and personal portfolios, including several Y Combinator-backed companies and bootstrapped products. The project was built by dillion, and its source code is available on GitHub.

Best for

Design engineers building React landing pages
Startups using shadcn/ui and Tailwind CSS
Developers creating personal portfolio sites
Open-source projects needing animated marketing pages

Pros

150+ free, open-source animated components
Built on React, TypeScript, Tailwind CSS and Motion
Designed to pair with shadcn/ui
Source code available on GitHub

Cons

Tied to the React and Tailwind CSS stack
Pro blocks and templates are a separate offering; pricing not shown

Pricing

The core library of 150+ components is free and open source, with a separate Magic UI Pro offering of 50+ blocks and templates whose price is not stated.

Magic UI FAQ

Is Magic UI free?: Yes, its 150+ animated components and effects are free and open source. Magic UI Pro is a separate offering with 50+ blocks and templates.
What technologies does Magic UI use?: Components are built with React, TypeScript, Tailwind CSS and Motion.
Does it work with shadcn/ui?: The site describes Magic UI as a perfect companion for shadcn/ui.
Where is the source code?: The source code is available on GitHub.