ClawHub

Awesome Design MD

Other

收录50+知名网站的设计系统DESIGN.md文件，支持一键查看和复制，助力AI复刻顶级网站视觉风格。

Install

openclaw skills install awesome-design-md

Awesome Design MD

[一句话总览]

收录50+知名网站的DESIGN.md设计系统文件，让AI代理一键复刻顶级网站的视觉风格。

[简介]

这个技能库收集了来自全球知名网站的 DESIGN.md 设计系统文档，包括：

  • AI/科技: Claude, OpenAI, Vercel, Linear, Cursor, Stripe
  • 开发者工具: GitHub, Vercel, Supabase, Sentry, Raycast
  • 设计工具: Figma, Framer, Webflow, Notion
  • 品牌官网: Apple, Tesla, Airbnb, Spotify
  • 金融科技: Coinbase, Revolut, Wise
  • 汽车: Tesla, BMW, Ferrari, Lamborghini

每个 DESIGN.md 文件都遵循 Google Stitch 格式，包含完整的视觉主题、配色方案、字体规范、组件样式等。

[使用方法]

1. 查看可用设计系统

ls ~/.openclaw/workspace/skills/awesome-design-md/design-md/

2. 读取特定网站的 DESIGN.md

# 读取 Vercel 的设计系统
cat ~/.openclaw/workspace/skills/awesome-design-md/design-md/vercel/DESIGN.md

# 读取 Stripe 的设计系统
cat ~/.openclaw/workspace/skills/awesome-design-md/design-md/stripe/DESIGN.md

# 读取 Apple 的设计系统
cat ~/.openclaw/workspace/skills/awesome-design-md/design-md/apple/DESIGN.md

3. 在项目中使用

将 DESIGN.md 复制到你的项目根目录：

cp ~/.openclaw/workspace/skills/awesome-design-md/design-md/linear/DESIGN.md ./DESIGN.md

然后告诉 AI 代理：

"请根据 DESIGN.md 中的设计系统，创建一个类似 Linear 风格的页面"

[热门设计系统]

网站风格特点适用场景
Linear极简紫色、精确排版开发者工具、SaaS
Stripe紫色渐变、weight-300优雅支付、金融科技
Vercel黑白精准、Geist字体前端、部署平台
Apple大片留白、SF Pro、电影感产品展示、营销
Notion温暖极简、衬线标题文档、协作工具
Claude陶土色、干净编辑风AI助手、聊天
Cursor深色渐变、IDE风格代码编辑器
Raycast深色Chrome、活力渐变效率工具、启动器
Supabase深绿、代码优先后端、数据库
Figma多彩、 playful yet professional设计工具

[完整列表]

AI / LLM

  • claude - Anthropic, 陶土色温暖风格
  • cohere - 企业AI, 活力渐变
  • elevenlabs - AI语音, 深色电影感
  • minimax - 深色霓虹
  • mistral - 法式设计, 紫色调
  • ollama - 本地LLM, 终端简约
  • opencode - AI编码, 开发者深色
  • replicate - ML模型API, 白色代码风
  • runwayml - AI视频, 深色媒体丰富
  • together - 开源AI, 蓝图风格
  • xai - Elon Musk, 黑白未来感

开发者工具

  • cursor - AI代码编辑器
  • expo - React Native, 深色代码风
  • linear - 项目管理, 极简紫色
  • lovable - AI全栈, 活力渐变
  • mintlify - 文档平台, 绿色清爽
  • posthog - 产品分析, 刺猬品牌
  • raycast - 效率启动器
  • resend - 邮件API, 深色等宽
  • sentry - 错误监控, 粉紫深色
  • supabase - 开源Firebase, 深绿
  • superhuman - 极速邮件, 紫色光晕
  • vercel - 前端部署, 黑白精准
  • warp - 现代终端

设计/创意工具

  • airtable - 表格数据库, 多彩友好
  • clay - 创意机构, 有机渐变
  • figma - 协作设计, 多彩专业
  • framer - 网站构建, 黑蓝大胆
  • miro - 视觉协作, 黄色无限画布
  • notion - 全能工作区, 温暖极简
  • webflow - 视觉建站, 蓝色营销

金融科技

  • coinbase - 加密交易, 蓝色信任
  • kraken - 加密交易, 紫色深色
  • revolut - 数字银行, 渐变卡片
  • stripe - 支付基础设施
  • wise - 国际转账, 绿色友好

其他

  • airbnb - 暖珊瑚色, 摄影驱动
  • apple - 大片留白, 电影感
  • cal - 开源日程, 中性简洁
  • intercom - 友好蓝色, 对话UI
  • zapier - 自动化, 温暖橙色

收录50+知名网站设计系统，让AI复刻顶级视觉风格。