shadcn-svelte
为Svelte开发者提供可直接复用的UI组件库
安装使用
复制下面这段提示词发给你的 AI（Claude / Cursor / TRAE / Codex / WorkBuddy 等），它会自动帮你完成安装：
帮我安装这个 AI Skill：shadcn-svelte。 它的用途是：为Svelte开发者提供可直接复用的UI组件库 完整的 Skill 内容见：https://321skill.com/skills/shadcn-svelte/raw/index.md 请读取该页面内容，如果是 SKILL.md 格式直接安装，如果是 README 提炼核心 prompt 后安装。
提示词包含完整的 Skill 内容链接，AI 读取后即可完成安装。你也可以 查看完整内容 确认无误。
使用示例
“我正在用SvelteKit开发一个仪表盘，需要一个美观的数据表格组件和日期选择器。”，AI可以引导你访问 shadcn-svelte 文档，找到对应的 Data Table 和 Date Picker 组件，并解释如何复制其代码集成到你的项目中，以及如何根据你的品牌色修改主题变量。
介绍
shadcn-svelte 是一个专为 Svelte 框架开发者打造的 UI 组件库，它解决了 Svelte 生态中高质量、可直接复用的前端组件相对匮乏的问题。开发者无需安装整个庞大的 NPM 包，而是可以直接复制粘贴单个组件的源代码到自己项目中，实现高度的定制化和所有权。
使用方式非常简单：访问其官方网站，浏览组件文档，找到需要的组件（如按钮、表单、对话框等），然后一键复制其源代码到你的 Svelte 项目文件中即可开始使用和修改。这种方式赋予了开发者对组件代码的完全控制权。
这个库非常适合正在使用 Svelte 或 SvelteKit 进行应用开发的前端工程师、全栈开发者以及希望快速搭建美观且可访问性良好的 UI 界面的团队。它尤其适合那些既想使用现成的设计系统，又不希望被第三方组件库的捆绑和升级所束缚的开发者。
与许多传统的 Svelte UI 库（如 Svelte Material UI、SvelteStrap）不同，shadcn-svelte 并非一个需要通过 npm install 引入的“黑盒”依赖。它的核心区别在于“复制粘贴”哲学，这直接带来了无依赖捆绑、零运行时开销、以及极致的可定制性。其设计美学源自广受欢迎的 shadcn/ui，但为 Svelte 的响应式语法和编译时特性进行了原生适配。
核心特点
核心区别在于其“复制粘贴”的使用模式，开发者将组件源代码直接复制到自己的项目中，从而获得对UI代码的完全所有权和零依赖的极致定制能力，这与需要npm安装的传统组件库有本质不同。
注意事项
不适合希望开箱即用、完全不想手动管理组件代码或需要复杂组件间深度联动功能的项目。
常见问题
shadcn-svelte 和原版 shadcn/ui 是什么关系？
它是 shadcn/ui 的非官方 Svelte 移植版，由社区驱动并获得了原作者的祝福，专门适配 Svelte 框架的语法和特性。
需要安装整个库吗？
不需要。使用方式是访问官网，按需复制单个组件的源代码到你的项目中，因此没有传统的 npm 安装步骤。
给 AI 助手的安装指引
如果你的 AI 编程助手（Claude Code、Cursor、TRAE 等）能看到这个页面，把下面这段发给它即可自动完成安装：
请访问 https://321skill.com/skills/shadcn-svelte/raw/index.md 读取 shadcn-svelte 的原始 Skill 定义（Markdown 格式），按其中说明在我的环境里完成安装和配置。
AI 可直接读取的原始 Markdown 地址：/skills/shadcn-svelte/raw/index.md（查看排版版本）