Design References — 59 brand DESIGN.md specs
When the user references a brand by name, fetch that brand's DESIGN.md instead of using a generic style skill (taste-skill, soft-skill, etc.). Brand-match always beats generic.
How to use
- User says "make it look like X" / "X-style" / "X feel" / "match Stripe's aesthetic" → look up brand below
- Fetch the spec via WebFetch:
https://getdesign.md/design-md/<brand>/DESIGN.md
- Apply that spec as the source of truth for tokens, typography, motion, and components.
- If the user names a brand NOT in this list, fall back to taste-skill / ui-ux-pro-max + the user's description.
Available brands (59)
SaaS / Dev tools
airtable · cal · clickhouse · composio · cursor · expo · figma · framer · hashicorp · intercom · linear.app · lovable · mintlify · miro · mongodb · notion · opencode.ai · posthog · raycast · replicate · resend · sanity · semrush · sentry · supabase · superhuman · vercel · voltagent · warp · webflow · zapier
AI labs / models
claude · cohere · elevenlabs · minimax · mistral.ai · nvidia · ollama · runwayml · together.ai · x.ai
Fintech / payments
coinbase · kraken · revolut · stripe · wise
Consumer / lifestyle
airbnb · apple · pinterest · spotify · uber
Automotive / hardware
bmw · clay · ferrari · lamborghini · renault · spacex · tesla
Enterprise / infra
ibm
Quick brand → vibe map
| Brand |
Use for |
| stripe |
Premium fintech, purple gradients, weight-300 elegance |
| apple |
Consumer hardware, SF Pro, cinematic imagery, generous whitespace |
| linear.app |
Software/SaaS, dark, neutral, ultra-precise spacing |
| vercel |
Dev tools, Geist font, monochrome with electric accent |
| claude |
AI products, warm/editorial, soft serif |
| cursor |
Code editors, dark, tight sans, syntax-highlight palette |
| notion |
Productivity, soft cream, warm blacks, friendly |
| figma |
Creative tools, vibrant accents on neutral |
| coinbase |
Crypto/finance, blue trust, clean grids |
| airbnb |
Marketplace, photographic-first, soft shadows |
| superhuman |
Email/productivity, dense, mono-adjacent |
| raycast |
Launcher/utility, dark, command-palette aesthetic |
| tesla |
Premium hardware, minimal/black, technical |
| ferrari / lamborghini |
Luxury automotive, red/black, cinematic |
| resend |
Dev/email, Geist + clean grayscale |
| runwayml |
AI creative, experimental, dark + saturated |
| posthog |
Analytics, hedgehog-quirky, friendly serious |
| mintlify |
Docs, clean technical |
| wise |
Banking, green/cream, friendly trust |
(For brands not in the table, just fetch the DESIGN.md — each starts with a one-line description.)
What's in each DESIGN.md
Every spec contains tokens for:
- Color palette (semantic + raw)
- Typography (font stacks, scale, weights)
- Spacing scale + grid
- Motion / easing curves
- Border radius scale
- Shadows / elevation
- Component patterns (buttons, cards, nav)
- Brand voice / tone notes
Sizes range from ~20 KB (Stripe) to ~37 KB (Apple).
Local mirror (offline reference, stub-only)
C:\Users\A\.claude\design-references\awesome-design-md\design-md\<brand>\README.md
These are stubs that point to the canonical URL. The actual content lives at getdesign.md.
Routing rule
When invoked, the design-conductor stage 2 (STYLE) should prefer this skill over generic style picks if a brand match exists. Otherwise fall through to taste-skill / soft-skill / brutalist-skill / etc.
1---2name: design-references3description: Fetch brand-specific DESIGN.md system specs from getdesign.md when the user wants UI to match a known brand's aesthetic ("make it look like Stripe", "Apple-style", "Linear feel"). Covers 59 brands across SaaS, fintech, consumer tech, automotive, AI labs, and creator tools. Use BEFORE picking a generic style skill — brand match always beats generic.4---56# Design References — 59 brand DESIGN.md specs78When the user references a brand by name, fetch that brand's DESIGN.md instead of using a generic style skill (taste-skill, soft-skill, etc.). Brand-match always beats generic.910## How to use11121. User says "make it look like X" / "X-style" / "X feel" / "match Stripe's aesthetic" → look up brand below132. Fetch the spec via WebFetch:14 ```15 https://getdesign.md/design-md/<brand>/DESIGN.md16 ```173. Apply that spec as the source of truth for tokens, typography, motion, and components.184. If the user names a brand NOT in this list, fall back to taste-skill / ui-ux-pro-max + the user's description.1920## Available brands (59)2122### SaaS / Dev tools23`airtable` · `cal` · `clickhouse` · `composio` · `cursor` · `expo` · `figma` · `framer` · `hashicorp` · `intercom` · `linear.app` · `lovable` · `mintlify` · `miro` · `mongodb` · `notion` · `opencode.ai` · `posthog` · `raycast` · `replicate` · `resend` · `sanity` · `semrush` · `sentry` · `supabase` · `superhuman` · `vercel` · `voltagent` · `warp` · `webflow` · `zapier`2425### AI labs / models26`claude` · `cohere` · `elevenlabs` · `minimax` · `mistral.ai` · `nvidia` · `ollama` · `runwayml` · `together.ai` · `x.ai`2728### Fintech / payments29`coinbase` · `kraken` · `revolut` · `stripe` · `wise`3031### Consumer / lifestyle32`airbnb` · `apple` · `pinterest` · `spotify` · `uber`3334### Automotive / hardware35`bmw` · `clay` · `ferrari` · `lamborghini` · `renault` · `spacex` · `tesla`3637### Enterprise / infra38`ibm`3940## Quick brand → vibe map4142| Brand | Use for |43|-------|---------|44| **stripe** | Premium fintech, purple gradients, weight-300 elegance |45| **apple** | Consumer hardware, SF Pro, cinematic imagery, generous whitespace |46| **linear.app** | Software/SaaS, dark, neutral, ultra-precise spacing |47| **vercel** | Dev tools, Geist font, monochrome with electric accent |48| **claude** | AI products, warm/editorial, soft serif |49| **cursor** | Code editors, dark, tight sans, syntax-highlight palette |50| **notion** | Productivity, soft cream, warm blacks, friendly |51| **figma** | Creative tools, vibrant accents on neutral |52| **coinbase** | Crypto/finance, blue trust, clean grids |53| **airbnb** | Marketplace, photographic-first, soft shadows |54| **superhuman** | Email/productivity, dense, mono-adjacent |55| **raycast** | Launcher/utility, dark, command-palette aesthetic |56| **tesla** | Premium hardware, minimal/black, technical |57| **ferrari / lamborghini** | Luxury automotive, red/black, cinematic |58| **resend** | Dev/email, Geist + clean grayscale |59| **runwayml** | AI creative, experimental, dark + saturated |60| **posthog** | Analytics, hedgehog-quirky, friendly serious |61| **mintlify** | Docs, clean technical |62| **wise** | Banking, green/cream, friendly trust |6364(For brands not in the table, just fetch the DESIGN.md — each starts with a one-line description.)6566## What's in each DESIGN.md6768Every spec contains tokens for:69- Color palette (semantic + raw)70- Typography (font stacks, scale, weights)71- Spacing scale + grid72- Motion / easing curves73- Border radius scale74- Shadows / elevation75- Component patterns (buttons, cards, nav)76- Brand voice / tone notes7778Sizes range from ~20 KB (Stripe) to ~37 KB (Apple).7980## Local mirror (offline reference, stub-only)8182`C:\Users\A\.claude\design-references\awesome-design-md\design-md\<brand>\README.md`8384These are stubs that point to the canonical URL. The actual content lives at getdesign.md.8586## Routing rule8788When invoked, the design-conductor stage 2 (STYLE) should prefer this skill over generic style picks if a brand match exists. Otherwise fall through to taste-skill / soft-skill / brutalist-skill / etc.
bertbertov