用途:当用户希望代码和 UI 贴近某个产品品牌的视觉语言(如 Apple、Airbnb、Linear、Stripe 等),并在可运行 CLI 命令的项目中工作时,可使用本技能。它围绕 design-like CLI 展开,该 CLI 生成品牌专属的 Agent Skills 与 IDE 配置文件,为编码智能体提供具体的设计令牌、组件与规范。
主要能力:让智能体在界面建议中引用该品牌的颜色、字体、间距与动效令牌,采用推荐组件模式,并遵守品牌的无障碍、对比度与布局规范。支持 Apple、Airbnb、Linear、Shopify、Stripe、Notion、Figma、Spotify、Slack、Discord、IBM、Salesforce 等品牌。
使用方式:先确认目标品牌与所用 IDE 或智能体环境,并确认可在项目目录运行 npx。然后在项目根目录运行 npx design-like <brand>;也可运行 npx design-like 进行交互选择。可通过 npx design-like <brand> --ide <claude|cursor|vscode|antigravity|all> 指定目标环境。工具会检测环境并写入对应目录:Claude Code 为 .claude/skills/,Cursor 为 .cursor/rules/,VS Code 为 .vscode/instructions/,Antigravity 为 .agent/skills/。可用 --target path/to/app 指定目录,--force 覆盖已有文件(仅在明确需要时)。安装后通常生成 SKILL.md、tokens.json 及 IDE 专属规则文件。
适用场景:为新项目或现有组件引入某品牌的设计语言,或将通用组件改造成使用该品牌的令牌、圆角、阴影与动效曲线。
限制:需能运行 CLI 并向项目写入文件;受限环境无法使用。覆盖、预览等选项支持情况请以仓库实际文档为准;具体收费与价格暂未提供。