byted-util-getdesign-md

name	byted-util-getdesign-md
description	从 getdesign.md 下载知名品牌/网站的设计系统文档（DESIGN.md），为前端开发提供风格参考。当需要为项目选择或应用某个品牌的设计系统风格时使用此技能。
version	1.0.0
license	Apache-2.0
metadata	{"display_name":"品牌设计系统文档下载工具","permissions":["network","file_write"]}

getdesign-md Skill

从 getdesign.md 下载知名品牌/网站的设计系统规范文档（DESIGN.md），让前端开发能够快速复用成熟的设计体系。

核心功能

• 根据品牌名称下载对应的 DESIGN.md 设计系统文档
• 涵盖 60+ 知名品牌的设计规范（颜色、字体、间距、组件风格等）
• 下载后的 DESIGN.md 可直接放入项目根目录，指导前端开发

安装

# 无需安装，通过 npx 直接使用
npx getdesign@latest --help

使用方法

搜索可用的设计系统

# 列出所有可用的设计系统
npx getdesign@latest list

下载指定品牌的设计系统

# 下载 Stripe 风格的 DESIGN.md 到当前目录
npx getdesign@latest add stripe

# 下载 Apple 风格
npx getdesign@latest add apple

# 下载 Linear 风格
npx getdesign@latest add linear

# 下载 Nike 风格
npx getdesign@latest add nike

# 下载 Airbnb 风格
npx getdesign@latest add airbnb

常见品牌关键字

品牌名称全部使用小写，常用的包括：

品牌	关键字	风格描述
Apple	apple	极简白、SF Pro、影院级画面
Stripe	stripe	紫色渐变、轻盈优雅
Linear	linear	极简精确、紫色强调
Nike	nike	单色UI、大写字体、全幅摄影
Airbnb	airbnb	暖色珊瑚、圆润UI
Shopify	shopify	暗色优先、霓虹绿强调
Notion	notion	暖系极简、衬线标题
Figma	figma	多彩活力、专业有趣
Vercel	vercel	黑白精准、Geist字体
Spotify	spotify	深色背景绿色强调、大字体
Tesla	tesla	极度简化、全视口摄影
SpaceX	spacex	黑白对比、全幅图像、未来感
Claude	claude	暖色赤陶、干净编辑布局
Cursor	cursor	暗色界面、渐变强调
Supabase	supabase	暗色翡翠、代码优先
PostHog	posthog	开发者友好暗色UI

工作流程

1. 需求确认：了解项目目标和用户群体，选择合适的设计风格
2. 下载 DESIGN.md：使用 npx getdesign@latest add <brand> 下载到项目根目录
3. 分析设计规范：阅读 DESIGN.md 中的颜色系统、字体、间距、组件规范
4. 应用到开发：将设计规范转化为 TailwindCSS 配置或 CSS 变量，指导前端开发

注意事项

• DESIGN.md 文件会下载到当前工作目录
• 如果项目已有 DESIGN.md，会被覆盖
• 可以根据项目需要对下载的设计规范进行定制修改
• 建议将 DESIGN.md 放在项目根目录，方便团队成员参考