TypeUI for Grok
让 Grok 在构建或优化界面时，自动接入 TypeUI 的设计技能、品牌套件、UI 提示词与布局变体指引，生成更符合项目风格的 UI。
面向 Grok 的 TypeUI 平台适配版本，4 个平台变体（本条为 Grok 版）内容高度相似，本质是同一套设计系统上下文接入。
通过远程 MCP 服务器（mcp.typeui.sh）接入品牌资产和设计上下文，涉及连接第三方托管服务，具体数据流未核实。
这个 Skill 能做什么，适合哪些场景？
typeui 是 Bergside LLC 发布的一个面向 Grok 的技能，通过 TypeUI 的远程 MCP 服务器（https://mcp.typeui.sh）为 UI 生成提供项目上下文。它提供四类资源：项目设计技能、含 logo/字体/品牌色的品牌套件、常见界面区块与整产品流程的 UI 提示词库，以及布局变体指引。该技能属于 bergside/typeui 仓库（共打包 4 个技能）中 plugins/grok/typeui/skills/typeui/SKILL.md 下的这一个。适合希望在 AI 生成 UI 时保持一致视觉方向和品牌一致性的开发者。
该技能本身是一份指导性 SKILL.md：指示 Grok 在会话中优先使用 TypeUI MCP 工具；在请求未指定时询问用户使用哪个 TypeUI 项目或设计技能；在决定颜色、字体、间距、组件风格和页面构图之前先应用所选项目上下文；并区分品牌参数（logo、项目名、字体、品牌色）与设计技能（UI 风格、组件行为、视觉层级、间距、交互模式）。它注册远程 MCP 服务器 https://mcp.typeui.sh，实际的设计资源由该服务器提供，而非本地文件。
- 使用 Grok 构建落地页的开发者，希望直接套用自己在 TypeUI 中的项目设计上下文
- 需要在多个页面中保持品牌一致性（logo、字体、品牌色）的产品团队
- 想为定价区、仪表盘等常见区块快速生成多个布局变体再择优实现的设计师
- 在重设计现有界面之前，希望先拉取项目设计技能作为风格依据的工程师
这个 Skill 有哪些优点和局限？
- 通过远程 MCP 服务器接入，无需在本地维护设计资源文件
- 明确区分品牌套件与设计技能的职责边界，避免风格与品牌信息混用
- 支持布局变体生成，可在实现前比较多个方案
- SKILL.md 采用 MIT 许可，作者与主页信息完整
- 强依赖 TypeUI 远程 MCP 服务器的可用性，服务器离线时技能基本失去作用
- 该 SKILL.md 明确面向 Grok（含 grok mcp add 命令），在其他平台上使用需要手动适配
- 实际设计资源托管在 typeui.sh，README 提到存在付费 Pro 版本，免费与付费资源边界未在技能文件中说明
- 仓库级别的 GitHub 许可标记为 NOASSERTION，与 SKILL.md 中的 MIT 声明需自行核实适用范围
如何安装这个 Skill？
该技能位于 bergside/typeui 仓库的 plugins/grok/typeui/skills/typeui/ 目录（README 未单独说明此子技能的安装命令）。若当前 Grok 会话中 TypeUI MCP 服务器不可用，可手动连接：grok mcp add --transport http typeui https://mcp.typeui.sh
如何使用这个 Skill？
在已连接 TypeUI MCP 的 Grok 会话中直接用自然语言提出 UI 请求，例如："使用我的 TypeUI 项目构建一个落地页"、"用 TypeUI 生成三个定价区变体"、"使用我的 TypeUI 设计技能重新设计这个仪表盘"、"在修改 UI 前先拉取该项目的 TypeUI 上下文"。若请求未指明项目，技能会引导先确认使用哪个项目或设计技能。
这个 Skill 与同类方案有什么区别？
README 中明确提到可独立安装的 typeui-fundamentals 技能（UI/UX 基础原则），是同仓库内的替代/补充选择；本技能则依赖 TypeUI MCP 提供项目级设计上下文，二者定位不同。