一、它是什么：能直接 copy 的 React 动效组件库
Spectrum UI（arihantcodes/spectrum-ui，Apache-2.0，1.3K 星）是一批基于 shadcn/ui + Tailwind + Motion 的 React 动画组件：250 个组件 + 页面区块（hero/pricing/FAQ/footer）+ 几套完整模板（dashboard / 落地页），每个组件都有在线预览、代码就摆在下面。最大的特点一句话：不藏在 npm 包里，源码直接进你项目，改归你（nothing hidden behind a package, the source lands in your project）。
二、怎么取组件：三种，都能
① 问你的 AI 编辑器（MCP）：连一次 MCP 服务，Claude Code / Cursor / Windsurf 就能帮你浏览、搜索、直接把组件装进项目。视频里那句命令行就是它的 MCP 服务：
claude mcp add spectrum-ui -- npx -y @spectrumui/mcp装完直接说「给我加个看板（kanban board）和带动效的抽屉（animated drawer）」就行。其他编辑器（VS Code 等）的接法在 MCP 文档。MCP 包在 npm 上是 @spectrumui/mcp（实查 latest 0.1.1，2026-06 发布），作用就是让 AI 助手直接在代码库里浏览、搜、装 Spectrum 组件。
② shadcn CLI：项目里已配好 shadcn 的话：npx shadcn@latest add @spectrumui/animated-drawer。
③ 复制粘贴：打开组件页点 copy，贴进来也行。三条路殊途同归——组件源文件落在你仓库里。
三、为什么是它而不是直接用 Magic UI / Aceternity
Spectrum 的定位是把这些零散的「动画 UI 素材」整合成一套能统一安装、有文档、有 MCP、能一键取的库。组件来源是 Aceternity UI / Magic UI / ShadCN UI 这些生态里大家常抄的那批动效件（README 简介里明说 built using 这三家），但它做成了：统一 registry（registry.json + component-catalog.json）、统一文档站（ui.spectrumhq.in，每个组件下面直接给码 + 在线预览）、统一取用方式（MCP / shadcn CLI / copy）。对「想要动效又懒得一个个去各家官网抄 + 对着改依赖」的场景，它把摩擦降到「一句话」。
四、当前状态（实查）
截至 2026-09-16：仓库 2026-09-14 还在推，没归档；Apache-2.0 干净协议（没有 Hypit 那种 with conditions），商用没问题。技术栈：Next.js 14 + TypeScript + Tailwind + Radix + Motion，跑在 Vercel。1.3K 星是它的下限：文档全、在线可预览、MCP 现成，出问题搜得到、能直接看码自己改。
五、适合谁
适合「用 shadcn/ui + Tailwind 栈、想要一批带动效的现成组件（卡片/表单/弹窗/评级/媒体/反馈 + hero/定价/FAQ 区块 + 完整模板），且希望 AI 编辑器能替我装、装完源码在我手里」的前端 / 独立开发者。三点取舍：① Apache-2.0 免费可商用；② 它本质是「整合 + 分发」，组件多来自 Aceternity/Magic UI，不是全原创（但整合价值就在于统一取用 + 可 MCP）；③ 它要落在 shadcn/Tailwind 体系里才顺手，纯别的体系得自己搬。一句话：要「动效组件 + 让 AI 一句话帮你装」，Spectrum UI 是省事的那套。
仓库：github.com/arihantcodes/spectrum-ui · 官网 / 文档 / MCP：ui.spectrumhq.in · MCP 包：npx -y @spectrumui/mcp（latest 0.1.1）· 星标 1,327 / Apache-2.0 / 250 组件（截至 2026-09-16 实查）