Agent Academy

Agent Academy is a free, source-linked library of skills, prompts, MCP servers and bot templates, organised into courses by profession, for people who hand real work to AI agents: 1,467 live resources, each with its original link, license and safety tags.

Style library

awesome-design-md

Apple、Stripe、Linear、Notion 等大厂 DESIGN.md 合集,放进项目根目录让 Agent 照着做

No credentialsDoes not send

https://github.com/VoltAgent/awesome-design-md

Original content

Full originalMITSource

Republished in full under its license, with attribution. The source is authoritative.

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.

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.

FileWho reads itWhat it defines
AGENTS.mdCoding agentsHow to build the project
DESIGN.mdDesign agentsHow the project should look and feel

This repo provides ready-to-use DESIGN.md files extracted from real websites.

Request a DESIGN.md

You can request a DESIGN.md for specific website, including private requests delivered exclusively to you.

👉 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.

Collection

AI & LLM Platforms

  • Claude - Anthropic's AI assistant. Warm terracotta accent, clean editorial layout
  • Cohere - Enterprise AI platform. Vibrant gradients, data-rich dashboard aesthetic
  • ElevenLabs - AI voice platform. Dark cinematic UI, audio-waveform aesthetics
  • Jobright - AI job-hunting platform. Spring-mint green, black pill buttons, condensed Titillium headlines
  • Minimax - AI model provider. Bold dark interface with neon accents
  • Mistral AI - Open-weight LLM provider. French-engineered minimalism, purple-toned
  • Ollama - Run LLMs locally. Terminal-first, monochrome simplicity
  • OpenCode AI - AI coding platform. Developer-centric dark theme
  • Replicate - Run ML models via API. Clean white canvas, code-forward
  • 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.
  • Together AI - Open-source AI infrastructure. Technical, blueprint-style design
  • VoltAgent - AI agent framework. Void-black canvas, emerald accent, terminal-native
  • xAI - Elon Musk's AI lab. Stark monochrome, futuristic minimalism

Developer Tools & IDEs

  • Cursor - AI-first code editor. Sleek dark interface, gradient accents
  • Expo - React Native platform. Dark theme, tight letter-spacing, code-centric
  • Lovable - AI full-stack builder. Playful gradients, friendly dev aesthetic
  • Raycast - Productivity launcher. Sleek dark chrome, vibrant gradient accents
  • Superhuman - Fast email client. Premium dark UI, keyboard-first, purple glow
  • Vercel - Frontend deployment platform. Black and white precision, Geist font
  • Warp - Modern terminal. Dark IDE-like interface, block-based command UI

Backend, Database & 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
  • Oracle - Enterprise cloud and database software. Warm neutral ladder, charcoal-only actions, red saved for the wordmark
  • PostHog - Product analytics. Playful hedgehog branding, developer-friendly dark 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.
  • Sentry - Error monitoring. Dark dashboard, data-dense, pink-purple accent
  • Supabase - Open-source Firebase alternative. Dark emerald theme, code-first

Productivity & SaaS

  • Cal.com - Open-source scheduling. Clean neutral UI, developer-oriented simplicity
  • Intercom - Customer messaging. Friendly blue palette, conversational UI patterns
  • 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
  • SAP - Enterprise business software. White canvas, flat blue bands, application-frame chrome
  • 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
  • Mastercard - Global payments network. Warm cream canvas, orbital pill shapes, editorial warmth
  • Mercury - Startup banking platform. Ink-violet night world, indigo action pill, light custom sans
  • NerdWallet - Personal finance comparison platform. Deep spruce green, mint washes, near-square corners
  • Revolut - Digital banking. Sleek dark interface, gradient cards, fintech precision
  • Stripe - Payment infrastructure. Signature purple gradients, weight-300 elegance
  • Wise - International money transfer. Bright green accent, friendly and clear

E-commerce & Retail

  • Airbnb - Travel marketplace. Warm coral accent, photography-driven, rounded UI
  • Meta - Tech retail store. Photography-first, binary light/dark surfaces, Meta Blue CTAs
  • mydealz - German deals community. Dense white-card feed, hot and cold voting pill, brand green
  • Nike - Athletic retail. Monochrome UI, massive uppercase Futura, full-bleed photography
  • 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

Media & Consumer Tech

  • 1win - Crypto casino and sportsbook. Near-black canvas, vivid green action color, dense game-tile rails
  • Al Jazeera - Global news network. Flat white paper, dense Roboto headlines, orange signature and live red
  • Apple - Consumer electronics. Premium white space, SF Pro, cinematic imagery
  • DJI - Drone and camera maker. Studio product tiles, engineering-blue pills, tight Open Sans
  • HP - PC and printer maker. Pure white canvas, HP Electric Blue signal CTA, geometric Forma DJR Micro, blue chevron decorations
  • IBM - Enterprise technology. Carbon design system, structured blue palette
  • NVIDIA - GPU computing. Green-black energy, technical power aesthetic
  • Oura - Smart ring wellness brand. Warm paper cream, editorial serif, earth-tone accents
  • Pinterest - Visual discovery platform. Red accent, masonry grid, image-first
  • PlayStation - Gaming console retail. Three-surface channel layout, cyan hover-scale interaction
  • SpaceX - Space technology. Stark black and white, full-bleed imagery, futuristic
  • Spotify - Music streaming. Vibrant green on dark, bold type, album-art-driven
  • The Verge - Tech editorial media. Acid-mint and ultraviolet accents, Manuka display type
  • Uber - Mobility platform. Bold black and white, tight type, urban energy
  • Vodafone - Global telecom brand. Monumental uppercase display, Vodafone Red chapter bands
  • WIRED - Tech magazine. Paper-white broadsheet density, custom serif, ink-blue links

Automotive

  • BMW - Luxury automotive. Dark premium surfaces, precise German engineering aesthetic
  • BMW M - Performance automotive. Motorsport-inspired contrast, M color accents, precision-driven layout
  • Bugatti - Luxury hypercar. Cinema-black canvas, monochrome austerity, monumental display type
  • Ferrari - Luxury automotive. Chiaroscuro black-white editorial, Ferrari Red with extreme sparseness
  • Lamborghini - Luxury automotive. True black cathedral, gold accent, LamboType custom Neo-Grotesk
  • Renault - French automotive. Vivid aurora gradients, NouvelR proprietary typeface, zero-radius buttons
  • Tesla - Electric vehicles. Radical subtraction, cinematic full-viewport photography, Universal Sans

Retro Web · DESIGN.md Nostalgia

A Saturday series — DESIGN.md files extracted from the web of the 1990s. Drop one in and tell your AI agent to build a period-accurate vintage UI.

  • Dell (1996) - Catalog-era enterprise web. Literal black page frame, flat color-block "ribbon cards", chunky Helvetica-Black titles over Times Roman body, and hand-cut GIF stickers (NEW! bursts, award seals, beveled product photos).
  • Nintendo.com (2001) - Y2K "console chrome" web. Brushed-periwinkle beveled metal panels, a halftone-dotted carbon nav glowing amber, outlined Arial-Black box-art wordmarks over circuit-board hero fields, and a pixel Mario welcome bubble.

What's Inside Each DESIGN.md

Every file follows the Stitch DESIGN.md format with extended sections:

#SectionWhat it captures
1Visual Theme & AtmosphereMood, density, design philosophy
2Color Palette & RolesSemantic name + hex + functional role
3Typography RulesFont families, full hierarchy table
4Component StylingsButtons, cards, inputs, navigation with states
5Layout PrinciplesSpacing scale, grid, whitespace philosophy
6Depth & ElevationShadow system, surface hierarchy
7Do's and Don'tsDesign guardrails and anti-patterns
8Responsive BehaviorBreakpoints, touch targets, collapsing strategy
9Agent Prompt GuideQuick color reference, ready-to-use prompts

Each site includes:

FilePurpose
DESIGN.mdThe design system (what agents read)
preview.htmlVisual catalog showing color swatches, type scale, buttons, cards
preview-dark.htmlSame catalog with dark surfaces

How to Use

  1. Copy a site's DESIGN.md into your project root
  2. Tell your AI agent to use it.

Contributing

See [CONTRIBUTING.md](CONTRIBUTING.md) for guidelines.

  • Improve existing files: Fix wrong colors, missing tokens, weak descriptions
  • Report issues: Let us know if something looks off

Before opening a PR, please open an issue first to discuss your idea and get feedback from maintainers.

License

MIT License - see [LICENSE](LICENSE)

This repository is a curated collection of design system documents extracted from public websites. All DESIGN.md files are provided "as is" without warranty. The extracted design tokens represent publicly visible CSS values. We do not claim ownership of any site's visual identity. These documents exist to help AI agents generate consistent UI.

Related

Design systemDesign

Apple Human Interface Guidelines

Apple's platform design guidance: foundations, patterns, components, inputs, technologies.

Sourcedeveloper.apple.com/design/human-interface-guidelines

No credentialsDoes not sendApple terms; link only
Style libraryDesign

UI Hub (Incidental AI UI resource hub) — llms.txt / api

Curated multilingual directory of ~2,391 public UI resources with visual-style (vs) facets, design KB (specs, skills), JSON endpoints and a recommended design-skill workflow.

Sourcesiinxu.github.io/ui-resource-hub/llms.txt

No credentialsDoes not sendaggregator; per-item license
WorkflowDesign

UI Hub skills.json (recommended design workflow)

Workflow: pick ONE direction skill (frontend-design or taste-skill) → search resources by style/kind → build with emil-design-eng → audit with impeccable + web-design-guidelines + accessibility → verify in browser light+dark, mobile.

Sourcesiinxu.github.io/ui-resource-hub/api/skills.json

No credentialsDoes not sendaggregator
SkillDesign

algorithmic-art

Creating algorithmic art using p5.js with seeded randomness and interactive parameter exploration. Use this when users request creating art using code, generative art, algorithmic art, flow fields, or particle systems. Create original algorithmic art rather than copying existing artists' work to avoid copyright violations.

Sourcegithub.com/anthropics/skills/blob/main/skills/algorithmic-art/SKILL.md

No credentialsDoes not sendApache-2.0
SkillDesign

canvas-design

Create beautiful visual art in .png and .pdf documents using design philosophy. You should use this skill when the user asks to create a poster, piece of art, design, or other static piece. Create original visual designs, never copying existing artists' work to avoid copyright violations.

Sourcegithub.com/anthropics/skills/blob/main/skills/canvas-design/SKILL.md

No credentialsDoes not sendApache-2.0
CaseDesign

Multimodal Design Agent Team

A Streamlit application that provides comprehensive design analysis using a team of specialized AI agents powered by Google's Gemini model.

Sourcegithub.com/Shubhamsaboo/awesome-llm-apps/tree/main/advanced_ai_agents/multi_agent_apps/agent_teams/multimodal_design_agent_team

No credentialsDoes not sendApache-2.0