VoltAgent / awesome-design-md

Curated collection of DESIGN.md analysis by developer-focused websites. Awesome DESIGN.md: Copy a DESIGN.md into your project, tell your AI agent “build me a page that looks like this,” and generate high-quality UI that stays visually consistent with the design language. Built with real design depth — including analyzed patterns, tokens, and rules — for high-quality UI generation, not surface-level outputs.

这是一个由开发者导向网站整理的 DESIGN.md 分析合集。Awesome DESIGN.md 的使用方法是：将一个 DESIGN.md 文件复制到你的项目中，告诉你的 AI 代理“帮我构建一个看起来像这样的页面”，即可生成与该设计语言保持视觉一致的高质量 UI。它基于真实的设计深度构建——包括已分析的模式、令牌（tokens）和规则——旨在生成高质量的 UI，而非仅仅是表面的输出。

What is DESIGN.md? DESIGN.md is a new concept introduced by Google Stitch. A plain-text design system document that AI agents read to generate consistent UI. It’s just a markdown file. No Figma exports, no JSON schemas, no special tooling. Drop it into your project root and any AI coding agent or Google Stitch instantly understands how your UI should look. Markdown is the format LLMs read best, so there’s nothing to parse or configure.

什么是 DESIGN.md？DESIGN.md 是 Google Stitch 引入的一个新概念。它是一份纯文本的设计系统文档，供 AI 代理读取以生成一致的 UI。它就是一个 Markdown 文件，无需 Figma 导出，无需 JSON 模式，也无需特殊工具。将其放入项目根目录，任何 AI 编程代理或 Google Stitch 都能立即理解你的 UI 应该是什么样子。Markdown 是大语言模型（LLM）读取效果最好的格式，因此无需进行任何解析或配置。

File	Who reads it	What it defines
AGENTS.md	Coding agents	How to build the project
DESIGN.md	Design agents	How the project should look and feel

文件	读取对象	定义内容
AGENTS.md	编程代理	如何构建项目
DESIGN.md	设计代理	项目的视觉外观与交互感受

This repo provides ready-to-use DESIGN.md files extracted from real websites. Request a DESIGN.md: You can request a DESIGN.md for a specific website, including private requests delivered exclusively to you.

该仓库提供了从真实网站中提取的、可直接使用的 DESIGN.md 文件。请求 DESIGN.md：你可以为特定网站请求 DESIGN.md，包括专门为你提供的私有请求。

AI Design + Build Ecosystem Tools 👉 Feature your product alongside the developers, designers, and vibecoders shipping UI with AI coding agents and web builders. Ranked #150 globally on GitHub. A community resource used by developers, designers, and vibecoders.

AI 设计 + 构建生态系统工具 👉 让你的产品与那些使用 AI 编程代理和网页构建器交付 UI 的开发者、设计师和“氛围编码者”（vibecoders）并列展示。在 GitHub 全球排名第 150 位。这是一个供开发者、设计师和“氛围编码者”使用的社区资源。

Collection (精选集)

AI & LLM Platforms (AI 与大模型平台)

• Claude - Anthropic’s AI assistant. Warm terracotta accent, clean editorial layout. (Anthropic 的 AI 助手。温暖的赤陶色点缀，简洁的编辑排版。)
• Cohere - Enterprise AI platform. Vibrant gradients, data-rich dashboard aesthetic. (企业级 AI 平台。充满活力的渐变色，数据丰富的仪表盘美学。)
• ElevenLabs - AI voice platform. Dark cinematic UI, audio-waveform aesthetics. (AI 语音平台。深色电影感 UI，音频波形美学。)
• Minimax - AI model provider. Bold dark interface with neon accents. (AI 模型提供商。大胆的深色界面，霓虹色点缀。)
• Mistral AI - Open-weight LLM provider. French-engineered minimalism, purple-toned. (开源权重 LLM 提供商。法式极简主义，紫色调。)
• Ollama - Run LLMs locally. Terminal-first, monochrome simplicity. (本地运行 LLM。终端优先，单色简洁风格。)
• OpenCode AI - AI coding platform. Developer-centric dark theme. (AI 编程平台。以开发者为中心的深色主题。)
• Replicate - Run ML models via API. Clean white canvas, code-forward. (通过 API 运行机器学习模型。干净的白色画布，代码优先。)
• Runway - AI creative-tools platform with an editorial film-festival aesthetic — cinematic dark heroes, paper-white reading bands, single proprietary sans, and pure black pill CTAs. (AI 创意工具平台，具有电影节编辑美学——电影感深色主视觉、纸白色阅读带、单一专有无衬线字体，以及纯黑色胶囊状 CTA 按钮。)
• Together AI - Open-source AI infrastructure. Technical, blueprint-style design. (开源 AI 基础设施。技术型、蓝图风格设计。)
• VoltAgent - AI agent framework. Void-black canvas, emerald accent, terminal-native. (AI 代理框架。虚空黑画布，翡翠绿点缀，原生终端感。)
• xAI - Elon Musk’s AI lab. Stark monochrome, futuristic minimalism. (埃隆·马斯克的 AI 实验室。强烈的单色调，未来主义极简风格。)

Developer Tools & IDEs (开发者工具与 IDE)

• Cursor - AI-first code editor. Sleek dark interface, gradient accents. (AI 优先的代码编辑器。时尚的深色界面，渐变色点缀。)
• Expo - React Native platform. Dark theme, tight letter-spacing, code-centric. (React Native 平台。深色主题，紧凑的字间距，以代码为中心。)
• Lovable - AI full-stack builder. Playful gradients, friendly dev aesthetic. (AI 全栈构建器。俏皮的渐变色，友好的开发美学。)
• Raycast - Productivity launcher. Sleek dark chrome, vibrant gradient accents. (生产力启动器。时尚的深色铬合金质感，充满活力的渐变色点缀。)
• Superhuman - Fast email client. Premium dark UI, keyboard-first, purple glow. (快速电子邮件客户端。高级深色 UI，键盘优先，紫色光晕。)
• Vercel - Frontend deployment platform. Black and white precision, Geist font. (前端部署平台。黑白精准风格，Geist 字体。)
• Warp - Modern terminal. Dark IDE-like interface, block-based command UI. (现代终端。类似 IDE 的深色界面，基于块的命令 UI。)

Backend, Database & DevOps (后端、数据库与 DevOps)

• ClickHouse - Fast analytics database. Yellow-accented, technical documentation style. (快速分析数据库。黄色点缀，技术文档风格。)
• Composio - Tool integration platform. Modern dark with colorful integration icons. (工具集成平台。现代深色风格，带有多彩的集成图标。)
• HashiCorp - Infrastructure automation. Enterprise-clean, black and white. (基础设施自动化。企业级整洁风格，黑白配色。)
• MongoDB - Document database. Green leaf branding, developer documentation focus. (文档数据库。绿叶品牌标识，专注于开发者文档。)
• PostHog - Product analytics. Playful hedgehog branding, developer-friendly dark UI. (产品分析。俏皮的刺猬品牌标识，对开发者友好的深色 UI。)
• Sanity - Headless content platform with a dark-first editorial marketing surface — 112px display type, IBM Plex Mono technical eyebrows, and a single coral-red accent reserved for the highest-priority CTA. (无头内容平台，采用深色优先的编辑营销界面——112px 显示字体，IBM Plex Mono 技术风格标题，以及仅用于最高优先级 CTA 的珊瑚红点缀。)
• Sentry - Error monitoring. Dark dashboard, data-dense, pink-purple accent. (错误监控。深色仪表盘，数据密集，粉紫色点缀。)
• Supabase - Open-source Firebase alternative. Dark emerald theme, code-first. (开源 Firebase 替代品。深翡翠绿主题，代码优先。)

Productivity & SaaS (生产力与 SaaS)

• Cal.com - Open-source scheduling. Clean neutral UI, developer-oriented simplicity. (开源日程安排。干净的中性 UI，面向开发者的简洁风格。)
• Intercom - Customer messaging. Friendly blue palette, conversational UI patterns. (客户消息系统。友好的蓝色调，对话式 UI 模式。)
• Linear - Project management for engineers. Ultra-minimal, precise, purple accent. (工程师项目管理工具。极致极简，精准，紫色点缀。)
• Mintlify - Documentation platform. Clean, green-accented, reading-optimized. (文档平台。干净，绿色点缀，阅读优化。)
• Notion - All-in-one workspace. Warm minimalism, serif headings, soft surfaces. (一体化工作空间。温暖的极简主义，衬线标题，柔和的界面表面。)
• Resend - Email API for developers. Minimal dark theme, monospace accents. (开发者邮件 API。极简深色主题，等宽字体点缀。)
• Zapier - Automation platform. Warm orange, friendly illustration-driven. (自动化平台。温暖的橙色，友好的插画驱动风格。)

Design & Creative Tools (设计与创意工具)

• Airtable - Spreadsheet-database hybrid. Colorful, friendly, structured data aesthetic. (电子表格与数据库混合体。多彩、友好、结构化数据美学。)
• Clay - Creative agency. Organic shapes, soft gradients, art-directed layout. (创意代理机构。有机形状，柔和渐变，艺术指导排版。)
• Figma - Collaborative design tool. Vibrant multi-color, playful yet professional. (协作设计工具。充满活力的多色，俏皮又不失专业。)
• Framer - Website builder. Bold black and blue, motion-first, design-forward. (网站构建器。大胆的黑蓝色，动效优先，设计前沿。)
• Miro - Visual collaboration. Bright yellow accent, infinite canvas aesthetic. (视觉协作。明亮的黄色点缀，无限画布美学。)
• Webflow - Visual web builder. Blue-accented, polished marketing site aesthetic. (可视化网页构建器。蓝色点缀，精致的营销网站美学。)

Fintech & Crypto (金融科技与加密货币)

• Binance - Crypto exchange. Bold Binance Yellow on monochrome, trading-floor urgency. (加密货币交易所。单色背景上的大胆币安黄，交易大厅的紧迫感。)
• Coinbase - Crypto exchange. Clean blue identity, trust-focused, institutional feel. (加密货币交易所。干净的蓝色标识，专注于信任，机构感。)
• Kraken - Crypto trading platform. Purple-accented dark UI, data-dense dashboards. (加密交易平台。紫色点缀的深色 UI，数据密集的仪表盘。)
• Mastercard - Global payments network. Warm cream canvas, orbital pill shapes, editorial warmth. (全球支付网络。温暖的奶油色画布，轨道胶囊形状，编辑般的温暖感。)
• Revolut - Digital banking. Sleek dark interface, gradient cards, fintech precision. (数字银行。时尚的深色界面，渐变卡片，金融科技的精准感。)
• Stripe - Payment infrastructure. Signature purple gradients, weight-300 elegance. (支付基础设施。标志性的紫色渐变，300 字重的优雅感。)
• Wise - International money transfer. Bright green accent, friendly and clear. (国际汇款。明亮的绿色点缀，友好且清晰。)

E-commerce & Retail (电子商务与零售)

• Airbnb - Travel marketplace. Warm coral accent, photography-driven, rounded UI. (旅游市场。温暖的珊瑚色点缀，摄影驱动，圆润的 UI。)
• Meta - Tech retail store. Photography-first, binary light/dark surfaces, Meta Blue CTAs. (科技零售店。摄影优先，二元明/暗界面，Meta 蓝 CTA 按钮。)
• Nike - Athletic retail. Monochrome UI, massive uppercase Futura, full-bleed photography. (运动零售。单色 UI，巨大的大写 Futura 字体，全出血摄影图。)
• Shopify - E-commerce platform. Dark-first cinematic, neon green accent, ultra-light display type. (电子商务平台。深色优先的电影感，霓虹绿点缀，超细显示字体。)
• Starbucks - Coffee retail flagship. Four-tier earth-green system, warm cream canvas, proprietary SoDoSans typography. (咖啡零售旗舰。四层大地绿系统，温暖的奶油色画布，专有的 SoDoSans 字体。)

Media & Consumer Tech (媒体与消费科技)

• Apple (苹果)