阻止 Claude Code、Cursor 和 Gemini CLI 猜测你的 UI。brandMD 会将任何网站的设计系统提取成一个 spec-valid DESIGN.md，并通过官方 @google/design.md 打印。

AI编码代理在不了解你的颜色、字体、间距、组件和布局规则时，会生成通用界面。运行一个命令，在项目根中插入DESIGN.md，你的代理在写代码前就已经有了品牌上下文。输出是官方 DESIGN.md 格式：带有机器可读标记和规范散文段落的YAML前置文件。默认提取在本地运行，没有API密钥。

每个生成的DESIGN.md都能验证干净：

传递多个URL以合并品牌代币跨页面：npx brandmd https://site.com https://site.com/pricing https://site.com/docs -o DESIGN.md

输出到你的堆栈读取的输出：

• DESIGN.md（默认）：用于Claude代码、光标、Gemini CLI、Codex、Stitch
• --json：脚本、MCP服务器和代理工具链的原始提取令牌
• --css：CSS 自定义属性，可直接插入任意项目
• --tailwind：Tailwind v4 @theme 区块
• --html：可视化、可分享的品牌指南

结合：

• --agent：也写作’。

brandmd

Stop Claude Code, Cursor, and Gemini CLI from guessing your UI. brandmd extracts any website’s design system into a spec-valid DESIGN.md that passes the official @google/design.md linter.

AI coding agents generate generic screens when they don’t know your colors, fonts, spacing, components, and layout rules. Run one command, drop DESIGN.md in your project root, and your agent has brand context before it writes code. Output is the official DESIGN.md format: YAML frontmatter with machine-readable tokens plus canonical prose sections. Default extraction runs locally with no API key.

npx brandmd https://stripe.com -o DESIGN.md

Every generated DESIGN.md validates clean:

npx @google/design.md lint DESIGN.md   # 0 errors, 0 warnings

Pass multiple URLs to merge brand tokens across pages: npx brandmd https://site.com https://site.com/pricing https://site.com/docs -o DESIGN.md

Outputs to whatever your stack reads:

• DESIGN.md (default): for Claude Code, Cursor, Gemini CLI, Codex, Stitch
• --json: raw extracted tokens for scripts, MCP servers, and agent toolchains
• --css: CSS custom properties, drop into any project
• --tailwind: Tailwind v4 @theme block
• --html: visual, shareable brand guide

Combine with:

• --agent: also writes .cursor/rules/brand.mdc and SKILL.md to both .agents/skills/brand-style/ (the universal Agent Skills path used by skills.sh across 50+ agents) and .claude/skills/brand-style/ (backward-compat for direct Claude Code users). No manual wiring. Picked up automatically by Claude Code, Cursor, Codex, Gemini CLI, Kiro CLI, and the rest of the skills.sh ecosystem. Schema-compatible with Anthropic Claude Code Skills, google/skills, and vercel-labs/agent-skills.
• --dark: also extract dark mode tokens
• --vision: adds illustration style, photography mood, copywriting voice, and microcopy patterns from a screenshot. Requires GEMINI_API_KEY (free at aistudio.google.com/apikey). Uses gemini-3.8-flash; set BRANDMD_VISION_MODEL to pick another model. If the screenshot or the vision call fails the CSS-only DESIGN.md is still written and the run exits 1.

Works as brand context for Claude Code, Cursor rules, Gemini CLI, Codex, Google Stitch, MCP servers, and any coding agent that reads markdown.