daisyUI 编辑器与 LLM 接入指南用 llms.txt 与 MCP 让 AI 精准生成 Tailwind CSS 组件代码【免费下载链接】daisyui The most popular, free and open-source Tailwind CSS component library项目地址: https://gitcode.com/GitHub_Trending/da/daisyui本文是 daisyUI 官方「Code editors and LLM setup」文档的完整实践指南面向希望让 VSCode、Cursor、Zed、Windsurf、Claude、ChatGPT 等工具中的 AI 助手准确生成 daisyUI 组件代码的开发者。读完本文你将掌握三条让 AI「读懂」daisyUI 的路径——llms.txt快速引用、项目级永久规则文件、以及 Blueprint / Context7 / GitMCP 三类 MCP 服务器——并能在 10 种主流编辑器与 LLM 客户端中独立完成配置。文档主题与适用场景在 daisyUI 文档站中docs/editor板块仓库路径 packages/docs/src/routes/(routes)/docs/editor/page.md/docs/editor/page.md)充当一个「选择入口」集中列出了 10 种可配置的目标工具类别工具代码编辑器VSCode、Cursor、Zed、Windsurf桌面/命令行 AI 客户端Claude Desktop、Claude Code、ClineVSCode 扩展网页端 LLMChatGPT、Gemini、Grok每个工具对应一份独立子文档如 vscode/page.md/docs/editor/vscode/page.md)、cursor/page.md/docs/editor/cursor/page.md) 等但核心思路完全一致给 AI 提供 daisyUI 的官方文档上下文让它在回答你的 prompt 时输出符合 daisyUI 5 规范、可实际运行的 Tailwind CSS 代码。需要注意的一个前提本文解决的是「AI 生成代码准确性」问题而编辑器内 Tailwind CSS 的语法高亮与 IntelliSense 属于另一套配置各子文档均指向 Tailwind CSS 官方的编辑器设置说明不在本文范围内。核心机制一llms.txt——让 AI 读到 daisyUI 官方文档什么是 llms.txtdaisyUI 提供了一个https://daisyui.com/llms.txt文件它是 daisyUI 官方文档的精简纯文本版本专门用于帮助 LLM 依据你的 prompt 生成准确的 daisyUI 代码。它的价值在于大模型训练数据中的 daisyUI 知识可能过时或含混而实时引用 llms.txt 可以拿到当前版本daisyUI 5.x的准确类名、主题与用法。仓库中的生成实现这个 llms.txt 并非手工维护的静态文件而是由仓库中的服务端路由动态组装生成实现见 packages/docs/src/routes/llms.txt/server.js它通过import.meta.glob加载skills/daisyui/目录下的一系列技能文档包括 skills/daisyui/SKILL.md、install、usage、config、colors 五个 SKILL.md 以及components/*.md全部组件指南按固定顺序拼接根 SKILL → 安装 → 使用 → 配置 → 颜色 → 组件发现协议 → 全部组件文档每个文档会stripFrontmatter去掉 YAML 头部并在运行时统一注入source: https://daisyui.com/llms.txt、alwaysApply: true、applyTo: **等 frontmatter 字段使下游 Agent 能识别文档的适用范围与强制应用属性。也就是说你在各编辑器里引用的 llms.txt内容与仓库 skills/daisyui 目录下的官方技能文档一一对应阅读该目录即可了解 AI 将会「看到」的 daisyUI 知识全貌。三种使用方式各编辑器文档把 llms.txt 的使用归纳为三种粒度快速引用一次性在聊天窗口输入特定的引用指令让本次对话使用 llms.txt项目级永久设置用curl把 llms.txt 保存到项目内的规则文件让 Copilot / Cursor / Cline 默认读取作为自定义文档 / Workspace 附件把 llms.txt 注册为编辑器的可检索文档或上传到 Grok Workspace之后在需要时手动调用。核心机制二MCP 服务器MCPModel Context Protocol是 AI 模型与外部工具通信的开放 API 协议。在编辑器或 LLM 客户端中添加 MCP 服务器后AI 会实时调用该服务器获取上下文从而得到比「凭记忆生成」更准确的结果。daisyUI 文档推荐的 MCP 服务器有三类1. daisyUI Blueprint官方 MCP 服务器Blueprint 是 daisyUI 官方出品的 MCP 服务器详细介绍见文档站的 Blueprint 板块仓库对应页面 packages/docs/src/routes/(routes)/blueprint/page.svelte/blueprint/page.svelte)。其配置在仓库中有一份标准模板 packages/blueprint/mcp.json{ mcpServers: { daisyui-blueprint: { command: npx, args: [-y, daisyui-blueprintlatest], env: { LICENSE: YOUR_LICENSE_KEY, EMAIL: YOUR_EMAIL, FIGMA: YOUR_FIGMA_API_KEY } } } }要点需要先获取 Blueprint License配置时填入LICENSE许可证密钥与EMAIL邮箱FIGMA为可选环境变量仅在需要 Figma 设计稿转代码Figma-to-code时才需要填写 Figma API Key使用方式在 prompt 末尾追加use Blueprint MCP例如give me a light daisyUI 5 theme with tropical color palette. use Blueprint MCP2. Context7通用文档 MCPContext7 是一个通用的文档检索 MCP 服务器通过npx以 stdio 方式本地启动{ mcpServers: { Context7: { type: stdio, command: npx, args: [-y, upstash/context7-mcplatest] } } }Claude Code 还支持 HTTP 传输方式claude mcp add --transport http context7 https://mcp.context7.com/mcp。使用时代入use context7后缀即可无需 Blueprint 的许可密钥。3. daisyUI GitMCP仓库文档 MCPGitMCP 直接暴露 daisyUI 仓库的文档通过 SSE 或 HTTP 远程连接。在支持「Add MCP server」界面的工具中配置为{ mcpServers: { daisyui-github: { url: https://gitmcp.io/saadeghi/daisyui } } }在 Zed、Claude Desktop 等工具中则通过npx mcp-remote桥接npx mcp-remote https://gitmcp.io/saadeghi/daisyui。三类服务器适用场景对比维度BlueprintContext7GitMCP性质daisyUI 官方通用文档检索仓库文档直连是否需要许可证需要License Email不需要不需要可选扩展Figma 转代码需 FIGMA Key——传输方式stdionpxstdio / HTTPSSE / HTTPprompt 后缀use Blueprint MCPuse context7无需各编辑器与 LLM 的详细配置下面按工具逐一说明。所有配置片段均完整继承自对应子文档可直接复制使用。VSCodeGitHub Copilot文档vscode/page.md/docs/editor/vscode/page.md)快速使用在聊天窗口输入#fetch https://daisyui.com/llms.txtVSCode 会抓取 llms.txt 来生成代码。项目级永久设置执行以下命令将 llms.txt 保存到.github/instructions/daisyui.instructions.mdCopilot 会默认读取--create-dirs会自动创建目录curl -L https://daisyui.com/llms.txt --create-dirs -o .github/instructions/daisyui.instructions.mdMCP 配置按⌘ CMD ⇧ Shift PWindows 为Ctrl Shift P搜索MCP: Open User Configuration然后按需追加以下任意服务器到配置文件中。Blueprint{ servers: { daisyui-blueprint: { type: stdio, command: npx, args: [-y, daisyui-blueprintlatest], env: { LICENSE: YOUR BLUEPRINT LICENSE KEY, EMAIL: YOUR EMAIL ADDRESS, FIGMA: YOUR FIGMA API KEY (optional) } } } }Context7可直接点击文档中的「Install Context7 MCP」按钮一键安装或在项目根目录创建.vscode/mcp.json若不存在后追加{ servers: { context7: { type: stdio, command: npx, args: [ -y, upstash/context7-mcplatest ] } } }GitMCP同样在.vscode/mcp.json中追加{ servers: { daisyUI: { type: sse, url: https://gitmcp.io/saadeghi/daisyui } } }配置完成后在 Agent 模式下提问即可Blueprint / Context7 记得在 prompt 末尾加对应后缀。Cursor文档cursor/page.md/docs/editor/cursor/page.md)快速使用web https://daisyui.com/llms.txt项目级永久设置curl -L https://daisyui.com/llms.txt --create-dirs -o .cursor/rules/daisyui.mdc注册为自定义文档按⌘ CMD ⇧ Shift PWindows 为Ctrl Shift P→ 输入Add new custom docs→ 添加https://daisyui.com/llms.txt。之后在聊天窗口输入docs并选择daisyUI即可引用。MCP 配置按⌘ CMD ⇧ Shift P打开MCP: Open MCP Settings编辑~/.cursor/mcp.json。Blueprint需先获取 License{ mcpServers: { daisyui-blueprint: { type: stdio, command: npx, args: [-y, daisyui-blueprintlatest], env: { LICENSE: YOUR BLUEPRINT LICENSE KEY, EMAIL: YOUR EMAIL ADDRESS, FIGMA: YOUR FIGMA API KEY (optional) } } } }Context7点击Add MCP server后添加{ mcpServers: { Context7: { type: stdio, command: npx, args: [-y, upstash/context7-mcplatest] } } }GitMCP{ mcpServers: { daisyui-github: { url: https://gitmcp.io/saadeghi/daisyui } } }Zed文档zed/page.md/docs/editor/zed/page.md)快速使用在 Thread 聊天中于 prompt 前输入fetch https://daisyui.com/llms.txtMCP 配置按⌘ CMD ⇧ Shift PWindows 为Ctrl Shift P→ 选择agent: add context server添加以下 JSON。Blueprint{ daisyui-blueprint: { command: npx, args: [-y, daisyui-blueprintlatest], env: { LICENSE: YOUR BLUEPRINT LICENSE KEY, EMAIL: YOUR EMAIL ADDRESS, FIGMA: YOUR FIGMA API KEY (optional) } } }Context7{ context7: { command: npx, args: [-y, upstash/context7-mcplatest] } }GitMCPZed 通过 mcp-remote 桥接远程服务器{ daisyui-github: { command: npx, args: [-y, mcp-remote, https://gitmcp.io/saadeghi/daisyui] } }Windsurf文档windsurf/page.md/docs/editor/windsurf/page.md)快速使用web https://daisyui.com/llms.txtMCP 配置按⌘ CMD ⇧ Shift PWindows 为Ctrl Shift P→ 输入Windsurf: MCP Configuration Panel→ 点击Add custom server 编辑~/.codeium/windsurf/mcp_config.json。Blueprint{ mcpServers: { daisyui-blueprint: { type: stdio, command: npx, args: [-y, daisyui-blueprintlatest], env: { LICENSE: YOUR BLUEPRINT LICENSE KEY, EMAIL: YOUR EMAIL ADDRESS, FIGMA: YOUR FIGMA API KEY (optional) } } } }Context7{ mcpServers: { context7: { command: npx, args: [-y, upstash/context7-mcplatest] } } }GitMCP注意该工具使用serverUrl字段{ mcpServers: { daisyui-github: { serverUrl: https://gitmcp.io/saadeghi/daisyui } } }Claude Desktop文档claude/page.md/docs/editor/claude/page.md)快速使用在聊天窗口启用 Search功能并在 prompt 前粘贴 llms.txt 地址https://daisyui.com/llms.txt示例https://daisyui.com/llms.txt give me a light daisyUI 5 theme with tropical color paletteMCP 配置进入 Settings Developer → 点击Edit Config编辑claude_desktop_config.json。Blueprint{ mcpServers: { daisyui-blueprint: { type: stdio, command: npx, args: [-y, daisyui-blueprintlatest], env: { LICENSE: YOUR BLUEPRINT LICENSE KEY, EMAIL: YOUR EMAIL ADDRESS, FIGMA: YOUR FIGMA API KEY (optional) } } } }Context7{ mcpServers: { Context7: { type: stdio, command: npx, args: [-y, upstash/context7-mcplatest] } } }GitMCP{ mcpServers: { daisyui-github: { command: npx, args: [-y, mcp-remote, https://gitmcp.io/saadeghi/daisyui] } } }Claude Code命令行文档claudecode/page.md/docs/editor/claudecode/page.md)Claude Code 无需编辑 JSON直接用 CLI 注册 MCP 服务器。BlueprintFIGMA 可选claude mcp add daisyui-blueprint --env LICENSEYOUR_LICENSE_KEY --env EMAILYOUR_EMAIL --env FIGMAYOUR_FIGMA_API_KEY -- npx -y daisyui-blueprintlatestContext7两种方式任选# HTTP 传输远程 claude mcp add --transport http context7 https://mcp.context7.com/mcp # 本地服务器连接 claude mcp add context7 -- npx -y upstash/context7-mcpGitMCPHTTP 传输claude mcp add --transport http daisyui https://gitmcp.io/saadeghi/daisyuiChatGPT / Gemini / Grok网页端 LLM这三类网页端工具不支持项目级规则文件统一走「把 llms.txt 地址放进 prompt」的路径。ChatGPT文档chatgpt/page.md/docs/editor/chatgpt/page.md)启用 Search功能在 prompt 前加https://daisyui.com/llms.txt。其 MCP 支持目前标注为 coming soon…暂无配置项。Gemini文档gemini/page.md/docs/editor/gemini/page.md)启用 Deep research功能同样在 prompt 前加 llms.txt 地址。Grok文档grok/page.md/docs/editor/grok/page.md)Deep Search 方式启用꩜ Deep Search功能后把 llms.txt 地址放在 prompt 前Workspace 方式仅 SuperGrok访问 llms.txt 页面后右键「Save As...」下载文件再上传到 Grok 的 Workspace 作为附件。此后该 Workspace 内的每轮对话都能访问 daisyUI 文档且无需依赖 Deep Search响应更快。统一示例 prompthttps://daisyui.com/llms.txt give me a light daisyUI 5 theme with tropical color paletteClineVSCode 扩展文档cline/page.md/docs/editor/cline/page.md)快速使用在聊天窗口于 prompt 前输入https://daisyui.com/llms.txt项目级永久设置curl -L https://daisyui.com/llms.txt --create-dirs -o .clinerules/daisyui.mdMCP 配置点击 Cline 面板顶部导航栏的 MCP Servers 图标 → 选择Configure标签页 → 点击Configure MCP Servers按钮编辑cline_mcp_settings.json。Blueprint{ servers: { daisyui-blueprint: { type: stdio, command: npx, args: [-y, daisyui-blueprintlatest], env: { LICENSE: YOUR BLUEPRINT LICENSE KEY, EMAIL: YOUR EMAIL ADDRESS, FIGMA: YOUR FIGMA API KEY (optional) } disabled: false, autoApprove: [] } } }Context7直接从 Cline 的 MCP marketplace 安装Context7即可。GitMCP{ mcpServers: { daisyui-github: { url: https://gitmcp.io/saadeghi/daisyui, disabled: false, autoApprove: [] } } }配置速查与常见问题一份可复用的标准提问模板无论使用哪种接入方式官方各文档统一采用如下示例 prompt你可以照此模式描述任意 UI 需求give me a light daisyUI 5 theme with tropical color palette需要 Blueprint 或 Context7 时追加use Blueprint MCP/use context7后缀。常见注意事项Figma 转代码只有 Blueprint 支持且FIGMA环境变量是可选的——仅在需要 Figma 设计稿转代码时才填写快捷键差异所有「命令面板」操作在 macOS 为⌘ CMD ⇧ Shift PWindows 为Ctrl Shift PWindsurf 文档写作⌃ Ctrl ⇧ Shift P配置文件字段差异不同工具的 MCP 配置文件顶层键名不同——VSCode 的.vscode/mcp.json与 Cline 的cline_mcp_settings.json使用serversCursor / Windsurf / Claude Desktop 使用mcpServers配置时不要混淆GitMCP 的字段差异大多数工具用url字段指向https://gitmcp.io/saadeghi/daisyui但 Windsurf 使用serverUrlZed 与 Claude Desktop 则通过npx mcp-remote桥接远程服务器规则文件路径VSCode 存到.github/instructions/、Cursor 存到.cursor/rules/、Cline 存到.clinerules/各自对应其规则/指令加载机制。仓库内可继续深入阅读的参考文件llms.txt 的生成实现packages/docs/src/routes/llms.txt/server.jsllms.txt 的内容来源AI 实际读取的知识库skills/daisyui/SKILL.md 及 skills/daisyui/install/SKILL.md、skills/daisyui/usage/SKILL.md、skills/daisyui/config/SKILL.md、skills/daisyui/colors/SKILL.md、skills/daisyui/componentsBlueprint MCP 官方配置模板packages/blueprint/mcp.json各编辑器子文档editor/vscode/page.md/docs/editor/vscode/page.md)、editor/cursor/page.md/docs/editor/cursor/page.md)、editor/zed/page.md/docs/editor/zed/page.md)、editor/windsurf/page.md/docs/editor/windsurf/page.md)、editor/claude/page.md/docs/editor/claude/page.md)、editor/claudecode/page.md/docs/editor/claudecode/page.md)、editor/chatgpt/page.md/docs/editor/chatgpt/page.md)、editor/gemini/page.md/docs/editor/gemini/page.md)、editor/grok/page.md/docs/editor/grok/page.md)、editor/cline/page.md/docs/editor/cline/page.md)小结daisyUI 的编辑器与 LLM 接入方案可以归纳为一条主线无论使用哪个工具目标都是把 llms.txt 生成器 产出的官方文档知识注入 AI 的上下文。轻量场景用#fetch/web/ 直接粘贴 URL 快速引用即可团队协作或长期项目建议用curl落地为规则文件追求实时性与 Figma 转代码能力则接入 MCP 服务器官方 Blueprint 或开箱即用的 Context7 / GitMCP。配置完成后用本文给出的热带配色主题示例 prompt 验证一次就能立即感受到 AI 生成 daisyUI 5 代码的准确度提升。【免费下载链接】daisyui The most popular, free and open-source Tailwind CSS component library项目地址: https://gitcode.com/GitHub_Trending/da/daisyui创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 daisyUI 编辑器与 LLM 接入指南：用 llms.txt 与 MCP 让 AI 精准生成 Tailwind CSS 组件代码
daisyUI 编辑器与 LLM 接入指南用 llms.txt 与 MCP 让 AI 精准生成 Tailwind CSS 组件代码【免费下载链接】daisyui The most popular, free and open-source Tailwind CSS component library项目地址: https://gitcode.com/GitHub_Trending/da/daisyui本文是 daisyUI 官方「Code editors and LLM setup」文档的完整实践指南面向希望让 VSCode、Cursor、Zed、Windsurf、Claude、ChatGPT 等工具中的 AI 助手准确生成 daisyUI 组件代码的开发者。读完本文你将掌握三条让 AI「读懂」daisyUI 的路径——llms.txt快速引用、项目级永久规则文件、以及 Blueprint / Context7 / GitMCP 三类 MCP 服务器——并能在 10 种主流编辑器与 LLM 客户端中独立完成配置。文档主题与适用场景在 daisyUI 文档站中docs/editor板块仓库路径 packages/docs/src/routes/(routes)/docs/editor/page.md/docs/editor/page.md)充当一个「选择入口」集中列出了 10 种可配置的目标工具类别工具代码编辑器VSCode、Cursor、Zed、Windsurf桌面/命令行 AI 客户端Claude Desktop、Claude Code、ClineVSCode 扩展网页端 LLMChatGPT、Gemini、Grok每个工具对应一份独立子文档如 vscode/page.md/docs/editor/vscode/page.md)、cursor/page.md/docs/editor/cursor/page.md) 等但核心思路完全一致给 AI 提供 daisyUI 的官方文档上下文让它在回答你的 prompt 时输出符合 daisyUI 5 规范、可实际运行的 Tailwind CSS 代码。需要注意的一个前提本文解决的是「AI 生成代码准确性」问题而编辑器内 Tailwind CSS 的语法高亮与 IntelliSense 属于另一套配置各子文档均指向 Tailwind CSS 官方的编辑器设置说明不在本文范围内。核心机制一llms.txt——让 AI 读到 daisyUI 官方文档什么是 llms.txtdaisyUI 提供了一个https://daisyui.com/llms.txt文件它是 daisyUI 官方文档的精简纯文本版本专门用于帮助 LLM 依据你的 prompt 生成准确的 daisyUI 代码。它的价值在于大模型训练数据中的 daisyUI 知识可能过时或含混而实时引用 llms.txt 可以拿到当前版本daisyUI 5.x的准确类名、主题与用法。仓库中的生成实现这个 llms.txt 并非手工维护的静态文件而是由仓库中的服务端路由动态组装生成实现见 packages/docs/src/routes/llms.txt/server.js它通过import.meta.glob加载skills/daisyui/目录下的一系列技能文档包括 skills/daisyui/SKILL.md、install、usage、config、colors 五个 SKILL.md 以及components/*.md全部组件指南按固定顺序拼接根 SKILL → 安装 → 使用 → 配置 → 颜色 → 组件发现协议 → 全部组件文档每个文档会stripFrontmatter去掉 YAML 头部并在运行时统一注入source: https://daisyui.com/llms.txt、alwaysApply: true、applyTo: **等 frontmatter 字段使下游 Agent 能识别文档的适用范围与强制应用属性。也就是说你在各编辑器里引用的 llms.txt内容与仓库 skills/daisyui 目录下的官方技能文档一一对应阅读该目录即可了解 AI 将会「看到」的 daisyUI 知识全貌。三种使用方式各编辑器文档把 llms.txt 的使用归纳为三种粒度快速引用一次性在聊天窗口输入特定的引用指令让本次对话使用 llms.txt项目级永久设置用curl把 llms.txt 保存到项目内的规则文件让 Copilot / Cursor / Cline 默认读取作为自定义文档 / Workspace 附件把 llms.txt 注册为编辑器的可检索文档或上传到 Grok Workspace之后在需要时手动调用。核心机制二MCP 服务器MCPModel Context Protocol是 AI 模型与外部工具通信的开放 API 协议。在编辑器或 LLM 客户端中添加 MCP 服务器后AI 会实时调用该服务器获取上下文从而得到比「凭记忆生成」更准确的结果。daisyUI 文档推荐的 MCP 服务器有三类1. daisyUI Blueprint官方 MCP 服务器Blueprint 是 daisyUI 官方出品的 MCP 服务器详细介绍见文档站的 Blueprint 板块仓库对应页面 packages/docs/src/routes/(routes)/blueprint/page.svelte/blueprint/page.svelte)。其配置在仓库中有一份标准模板 packages/blueprint/mcp.json{ mcpServers: { daisyui-blueprint: { command: npx, args: [-y, daisyui-blueprintlatest], env: { LICENSE: YOUR_LICENSE_KEY, EMAIL: YOUR_EMAIL, FIGMA: YOUR_FIGMA_API_KEY } } } }要点需要先获取 Blueprint License配置时填入LICENSE许可证密钥与EMAIL邮箱FIGMA为可选环境变量仅在需要 Figma 设计稿转代码Figma-to-code时才需要填写 Figma API Key使用方式在 prompt 末尾追加use Blueprint MCP例如give me a light daisyUI 5 theme with tropical color palette. use Blueprint MCP2. Context7通用文档 MCPContext7 是一个通用的文档检索 MCP 服务器通过npx以 stdio 方式本地启动{ mcpServers: { Context7: { type: stdio, command: npx, args: [-y, upstash/context7-mcplatest] } } }Claude Code 还支持 HTTP 传输方式claude mcp add --transport http context7 https://mcp.context7.com/mcp。使用时代入use context7后缀即可无需 Blueprint 的许可密钥。3. daisyUI GitMCP仓库文档 MCPGitMCP 直接暴露 daisyUI 仓库的文档通过 SSE 或 HTTP 远程连接。在支持「Add MCP server」界面的工具中配置为{ mcpServers: { daisyui-github: { url: https://gitmcp.io/saadeghi/daisyui } } }在 Zed、Claude Desktop 等工具中则通过npx mcp-remote桥接npx mcp-remote https://gitmcp.io/saadeghi/daisyui。三类服务器适用场景对比维度BlueprintContext7GitMCP性质daisyUI 官方通用文档检索仓库文档直连是否需要许可证需要License Email不需要不需要可选扩展Figma 转代码需 FIGMA Key——传输方式stdionpxstdio / HTTPSSE / HTTPprompt 后缀use Blueprint MCPuse context7无需各编辑器与 LLM 的详细配置下面按工具逐一说明。所有配置片段均完整继承自对应子文档可直接复制使用。VSCodeGitHub Copilot文档vscode/page.md/docs/editor/vscode/page.md)快速使用在聊天窗口输入#fetch https://daisyui.com/llms.txtVSCode 会抓取 llms.txt 来生成代码。项目级永久设置执行以下命令将 llms.txt 保存到.github/instructions/daisyui.instructions.mdCopilot 会默认读取--create-dirs会自动创建目录curl -L https://daisyui.com/llms.txt --create-dirs -o .github/instructions/daisyui.instructions.mdMCP 配置按⌘ CMD ⇧ Shift PWindows 为Ctrl Shift P搜索MCP: Open User Configuration然后按需追加以下任意服务器到配置文件中。Blueprint{ servers: { daisyui-blueprint: { type: stdio, command: npx, args: [-y, daisyui-blueprintlatest], env: { LICENSE: YOUR BLUEPRINT LICENSE KEY, EMAIL: YOUR EMAIL ADDRESS, FIGMA: YOUR FIGMA API KEY (optional) } } } }Context7可直接点击文档中的「Install Context7 MCP」按钮一键安装或在项目根目录创建.vscode/mcp.json若不存在后追加{ servers: { context7: { type: stdio, command: npx, args: [ -y, upstash/context7-mcplatest ] } } }GitMCP同样在.vscode/mcp.json中追加{ servers: { daisyUI: { type: sse, url: https://gitmcp.io/saadeghi/daisyui } } }配置完成后在 Agent 模式下提问即可Blueprint / Context7 记得在 prompt 末尾加对应后缀。Cursor文档cursor/page.md/docs/editor/cursor/page.md)快速使用web https://daisyui.com/llms.txt项目级永久设置curl -L https://daisyui.com/llms.txt --create-dirs -o .cursor/rules/daisyui.mdc注册为自定义文档按⌘ CMD ⇧ Shift PWindows 为Ctrl Shift P→ 输入Add new custom docs→ 添加https://daisyui.com/llms.txt。之后在聊天窗口输入docs并选择daisyUI即可引用。MCP 配置按⌘ CMD ⇧ Shift P打开MCP: Open MCP Settings编辑~/.cursor/mcp.json。Blueprint需先获取 License{ mcpServers: { daisyui-blueprint: { type: stdio, command: npx, args: [-y, daisyui-blueprintlatest], env: { LICENSE: YOUR BLUEPRINT LICENSE KEY, EMAIL: YOUR EMAIL ADDRESS, FIGMA: YOUR FIGMA API KEY (optional) } } } }Context7点击Add MCP server后添加{ mcpServers: { Context7: { type: stdio, command: npx, args: [-y, upstash/context7-mcplatest] } } }GitMCP{ mcpServers: { daisyui-github: { url: https://gitmcp.io/saadeghi/daisyui } } }Zed文档zed/page.md/docs/editor/zed/page.md)快速使用在 Thread 聊天中于 prompt 前输入fetch https://daisyui.com/llms.txtMCP 配置按⌘ CMD ⇧ Shift PWindows 为Ctrl Shift P→ 选择agent: add context server添加以下 JSON。Blueprint{ daisyui-blueprint: { command: npx, args: [-y, daisyui-blueprintlatest], env: { LICENSE: YOUR BLUEPRINT LICENSE KEY, EMAIL: YOUR EMAIL ADDRESS, FIGMA: YOUR FIGMA API KEY (optional) } } }Context7{ context7: { command: npx, args: [-y, upstash/context7-mcplatest] } }GitMCPZed 通过 mcp-remote 桥接远程服务器{ daisyui-github: { command: npx, args: [-y, mcp-remote, https://gitmcp.io/saadeghi/daisyui] } }Windsurf文档windsurf/page.md/docs/editor/windsurf/page.md)快速使用web https://daisyui.com/llms.txtMCP 配置按⌘ CMD ⇧ Shift PWindows 为Ctrl Shift P→ 输入Windsurf: MCP Configuration Panel→ 点击Add custom server 编辑~/.codeium/windsurf/mcp_config.json。Blueprint{ mcpServers: { daisyui-blueprint: { type: stdio, command: npx, args: [-y, daisyui-blueprintlatest], env: { LICENSE: YOUR BLUEPRINT LICENSE KEY, EMAIL: YOUR EMAIL ADDRESS, FIGMA: YOUR FIGMA API KEY (optional) } } } }Context7{ mcpServers: { context7: { command: npx, args: [-y, upstash/context7-mcplatest] } } }GitMCP注意该工具使用serverUrl字段{ mcpServers: { daisyui-github: { serverUrl: https://gitmcp.io/saadeghi/daisyui } } }Claude Desktop文档claude/page.md/docs/editor/claude/page.md)快速使用在聊天窗口启用 Search功能并在 prompt 前粘贴 llms.txt 地址https://daisyui.com/llms.txt示例https://daisyui.com/llms.txt give me a light daisyUI 5 theme with tropical color paletteMCP 配置进入 Settings Developer → 点击Edit Config编辑claude_desktop_config.json。Blueprint{ mcpServers: { daisyui-blueprint: { type: stdio, command: npx, args: [-y, daisyui-blueprintlatest], env: { LICENSE: YOUR BLUEPRINT LICENSE KEY, EMAIL: YOUR EMAIL ADDRESS, FIGMA: YOUR FIGMA API KEY (optional) } } } }Context7{ mcpServers: { Context7: { type: stdio, command: npx, args: [-y, upstash/context7-mcplatest] } } }GitMCP{ mcpServers: { daisyui-github: { command: npx, args: [-y, mcp-remote, https://gitmcp.io/saadeghi/daisyui] } } }Claude Code命令行文档claudecode/page.md/docs/editor/claudecode/page.md)Claude Code 无需编辑 JSON直接用 CLI 注册 MCP 服务器。BlueprintFIGMA 可选claude mcp add daisyui-blueprint --env LICENSEYOUR_LICENSE_KEY --env EMAILYOUR_EMAIL --env FIGMAYOUR_FIGMA_API_KEY -- npx -y daisyui-blueprintlatestContext7两种方式任选# HTTP 传输远程 claude mcp add --transport http context7 https://mcp.context7.com/mcp # 本地服务器连接 claude mcp add context7 -- npx -y upstash/context7-mcpGitMCPHTTP 传输claude mcp add --transport http daisyui https://gitmcp.io/saadeghi/daisyuiChatGPT / Gemini / Grok网页端 LLM这三类网页端工具不支持项目级规则文件统一走「把 llms.txt 地址放进 prompt」的路径。ChatGPT文档chatgpt/page.md/docs/editor/chatgpt/page.md)启用 Search功能在 prompt 前加https://daisyui.com/llms.txt。其 MCP 支持目前标注为 coming soon…暂无配置项。Gemini文档gemini/page.md/docs/editor/gemini/page.md)启用 Deep research功能同样在 prompt 前加 llms.txt 地址。Grok文档grok/page.md/docs/editor/grok/page.md)Deep Search 方式启用꩜ Deep Search功能后把 llms.txt 地址放在 prompt 前Workspace 方式仅 SuperGrok访问 llms.txt 页面后右键「Save As...」下载文件再上传到 Grok 的 Workspace 作为附件。此后该 Workspace 内的每轮对话都能访问 daisyUI 文档且无需依赖 Deep Search响应更快。统一示例 prompthttps://daisyui.com/llms.txt give me a light daisyUI 5 theme with tropical color paletteClineVSCode 扩展文档cline/page.md/docs/editor/cline/page.md)快速使用在聊天窗口于 prompt 前输入https://daisyui.com/llms.txt项目级永久设置curl -L https://daisyui.com/llms.txt --create-dirs -o .clinerules/daisyui.mdMCP 配置点击 Cline 面板顶部导航栏的 MCP Servers 图标 → 选择Configure标签页 → 点击Configure MCP Servers按钮编辑cline_mcp_settings.json。Blueprint{ servers: { daisyui-blueprint: { type: stdio, command: npx, args: [-y, daisyui-blueprintlatest], env: { LICENSE: YOUR BLUEPRINT LICENSE KEY, EMAIL: YOUR EMAIL ADDRESS, FIGMA: YOUR FIGMA API KEY (optional) } disabled: false, autoApprove: [] } } }Context7直接从 Cline 的 MCP marketplace 安装Context7即可。GitMCP{ mcpServers: { daisyui-github: { url: https://gitmcp.io/saadeghi/daisyui, disabled: false, autoApprove: [] } } }配置速查与常见问题一份可复用的标准提问模板无论使用哪种接入方式官方各文档统一采用如下示例 prompt你可以照此模式描述任意 UI 需求give me a light daisyUI 5 theme with tropical color palette需要 Blueprint 或 Context7 时追加use Blueprint MCP/use context7后缀。常见注意事项Figma 转代码只有 Blueprint 支持且FIGMA环境变量是可选的——仅在需要 Figma 设计稿转代码时才填写快捷键差异所有「命令面板」操作在 macOS 为⌘ CMD ⇧ Shift PWindows 为Ctrl Shift PWindsurf 文档写作⌃ Ctrl ⇧ Shift P配置文件字段差异不同工具的 MCP 配置文件顶层键名不同——VSCode 的.vscode/mcp.json与 Cline 的cline_mcp_settings.json使用serversCursor / Windsurf / Claude Desktop 使用mcpServers配置时不要混淆GitMCP 的字段差异大多数工具用url字段指向https://gitmcp.io/saadeghi/daisyui但 Windsurf 使用serverUrlZed 与 Claude Desktop 则通过npx mcp-remote桥接远程服务器规则文件路径VSCode 存到.github/instructions/、Cursor 存到.cursor/rules/、Cline 存到.clinerules/各自对应其规则/指令加载机制。仓库内可继续深入阅读的参考文件llms.txt 的生成实现packages/docs/src/routes/llms.txt/server.jsllms.txt 的内容来源AI 实际读取的知识库skills/daisyui/SKILL.md 及 skills/daisyui/install/SKILL.md、skills/daisyui/usage/SKILL.md、skills/daisyui/config/SKILL.md、skills/daisyui/colors/SKILL.md、skills/daisyui/componentsBlueprint MCP 官方配置模板packages/blueprint/mcp.json各编辑器子文档editor/vscode/page.md/docs/editor/vscode/page.md)、editor/cursor/page.md/docs/editor/cursor/page.md)、editor/zed/page.md/docs/editor/zed/page.md)、editor/windsurf/page.md/docs/editor/windsurf/page.md)、editor/claude/page.md/docs/editor/claude/page.md)、editor/claudecode/page.md/docs/editor/claudecode/page.md)、editor/chatgpt/page.md/docs/editor/chatgpt/page.md)、editor/gemini/page.md/docs/editor/gemini/page.md)、editor/grok/page.md/docs/editor/grok/page.md)、editor/cline/page.md/docs/editor/cline/page.md)小结daisyUI 的编辑器与 LLM 接入方案可以归纳为一条主线无论使用哪个工具目标都是把 llms.txt 生成器 产出的官方文档知识注入 AI 的上下文。轻量场景用#fetch/web/ 直接粘贴 URL 快速引用即可团队协作或长期项目建议用curl落地为规则文件追求实时性与 Figma 转代码能力则接入 MCP 服务器官方 Blueprint 或开箱即用的 Context7 / GitMCP。配置完成后用本文给出的热带配色主题示例 prompt 验证一次就能立即感受到 AI 生成 daisyUI 5 代码的准确度提升。【免费下载链接】daisyui The most popular, free and open-source Tailwind CSS component library项目地址: https://gitcode.com/GitHub_Trending/da/daisyui创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 RELATED READING
延伸阅读
更多一线实战笔记与深度复盘，助您持续精进
