mcpField
B
brand-design-md

brand-design-md

github.com/podo设计与 UI29180 次安装1 天前更新
代码仓库

关于 brand-design-md

brand-design-md 是一项获取 62 个已记录品牌设计令牌并将其应用到项目 CSS 变量或 Tailwind 配置的技能。它适用于基于现有品牌形象制作演示、提案材料和原型。

主要功能

  1. 01涵盖 62 个已记录品牌
  2. 02提供颜色、字体、字距、圆角和阴影令牌
  3. 03将令牌应用到 CSS 变量或 Tailwind 配置
  4. 04提供全局或项目级安装指引

适用场景

  1. 01制作符合现有品牌风格的原型
  2. 02准备品牌风格一致的演示或提案材料

安装

复制下面的命令，在终端中运行。

$npx skills add https://github.com/podo/design-agent-skills --skill brand-design-md

安装后在 Claude Code 中输入/brand-design-md确认已加载。

附带文件stub.yaml

详细介绍

brand-design-md

目录占位条目 — 完整技能：zephyrwang6/brand-design-md

决策树

  1. 是否已安装完整技能？ 检查此位置的技能是否仍包含 das: 区块：

    • 全局：grep -q "^das:" ~/.agents/skills/brand-design-md/SKILL.md 2>/dev/null && echo "pointer" || echo "installed"
    • 项目：grep -q "^das:" .agents/skills/brand-design-md/SKILL.md 2>/dev/null && echo "pointer" || echo "installed"
    • 不包含 das: 区块 → 已安装完整技能，调用该技能并继续
    • 包含 das: 区块 → 转到第 2 步

  2. 检测范围，然后安装：

    检测范围：

    [ -e ~/.agents/skills/brand-design-md ] && echo "global" || echo "project"

    全局（使用 -g 安装）：

    npx skills add zephyrwang6/brand-design-md --skill brand-design-md -g -y

    项目（不使用 -g 安装）：

    npx skills add zephyrwang6/brand-design-md --skill brand-design-md -y

    Claude Code： 将任一命令作为以 ! 开头的聊天消息发送，即可在不退出对话的情况下运行命令。

安装后调用

  • 技能名称：brand-design-md
  • 触发短语：“brand tokens”“brand design”“match Stripe design”“62 brands”“brand-design-md”

功能

运行时会获取 62 个有文档记录的世界级品牌的精准设计令牌，包括主色和强调色、字体粗细、字间距、圆角和阴影值。这些品牌包括 Stripe、Linear、Apple、Figma、Notion、Vercel、Airbnb 和 Nike。获取后，会将这些令牌应用到当前项目的 CSS 变量或 Tailwind 配置中，让输出准确体现所选品牌的视觉风格。适合快速制作演示、推介材料或与品牌风格一致的原型，无需手动调研。

不适用场景

  • 需要从零开始开发自定义品牌形象时（此技能匹配现有品牌，不会创建新品牌）
  • 62 个品牌中没有符合目标的品牌时（使用 design-consultation 构建定制系统）
  • 品牌令牌的准确性涉及法律或合同敏感事项时（务必对照官方品牌指南核实令牌）

评论

支持 Markdown