Magic UI
面向设计工程师的 React 动画组件库，提供 150 多个免费开源组件与效果，可搭配 shadcn/ui 使用，适合正在做产品落地页、已在用 shadcn/ui 的前端工程师按需复制组件。
Magic UI 是一个面向设计工程师的 UI 组件库，解决的是落地页「看起来太素」的问题。它提供 150 多个免费开源的动画组件和效果，用 React、TypeScript、Tailwind CSS 和 Motion 写成，官方把它定位成 shadcn/ui 的搭配件——你照常搭页面结构，需要动效和装饰时从这里取组件。
主要功能
组件和模板是两条主线。组件页可以逐个浏览动画效果，复制代码进项目；模板页提供整页的落地页骨架，适合快速起一个营销页。站点还带一个 Showcase，列出用 Magic UI 搭出来的真实站点，从 YC 背景的创业公司到个人作品集都有，可以点进去看实际效果。
文档站内置搜索，按 ⌘K 可以调出命令面板直接跳转组件。页面本身也标注了 GitHub 上的收藏数（约 23.1k）和 170 个关注者，源码托管在 GitHub 上。
费用与限制
免费开源的部分是主体，150+ 组件都在这一档。页面上另有一个 Magic UI Pro，宣传语是「50+ blocks and templates to build beautiful landing pages in minutes」，属于付费的模板与区块包，具体价格页面没有给出。使用前需要会 React 和 Tailwind CSS，纯静态站点或非 React 项目用不上；组件以英文文档为主。
适合谁
适合正在做产品落地页、个人作品集的前端和设计工程师，尤其是已经在用 shadcn/ui 的项目，接进来不用改技术栈。只想找个现成页面模板、不写代码的人，Pro 那部分更对路，但得先确认价格。
常见问题
Magic UI 收费吗？
Magic UI 国内能访问吗？
Magic UI 有哪些平台 / App？
Magic UI 的替代品有哪些？
替代品 全部 6 个 →
React Bits
开源的 React 动画组件库，把文字动画、背景、交互卡片和微交互做成带可调参数的独立组件，支持复制源码或用 CLI 安装，适合正在做 React 项目、想给界面加现成动效又不想引入庞大依赖的前端开发者。同为开源 React 动画组件库，复制源码或 CLI 安装，动效场景几乎一一对应
21st
面向 React 开发者的 UI 组件库，收录上千个基于 Tailwind 的按钮、定价区块、AI 聊天界面等组件，可在线预览后复制提示词或安装命令，适合想让 AI 编程助手直接检索并安装界面的前端开发者。替代找现成区块这一块：上千个 Tailwind 组件可复制，但动画特效不如 Magic UI 集中
shadcn/ui
开源的 React 组件集合，基于 Radix UI 和 Tailwind CSS，把按钮、对话框、表单等源码放在文档站供按需复制，适合想统一团队组件风格、又不愿被第三方库默认样式绑住的前端开发者。替代基础组件这一块：同技术栈可搭配，但本身不带动画装饰效果，需另配动效库
Aceternity UI
面向 React 和 Next.js 的动画组件库，用 Tailwind CSS 与 Motion 写成，组件和区块可复制粘贴或由 MCP 代理安装，适合不擅长手写动效、要快速做出产品官网的独立开发者。同为 React/Tailwind 动效组件库，复制即用，定位与 Magic UI 最接近