design-md-library
Index into the awesome-design-md collection (VoltAgent/awesome-design-md, MIT).
74 DESIGN.md files extracted from real websites, each following the Google Stitch
DESIGN.md spec (9 sections: visual theme, color palette, typography, components,
layout, depth, do/don'ts, responsive, agent prompt guide).
Where the files live
The fork mirror is at:
~/dev/forks/JZKK720/awesome-design-md/design-md/<site>/DESIGN.md
Each <site>/ dir also has a README.md with a one-line description. Read the
DESIGN.md for the full design system; the README is just a label.
How to use
- Identify the brand/site the user wants to emulate (e.g. "make it look like Stripe",
"use the Linear design system", "build a page in the Vercel style").
- Check if that site is in the index below. If yes,
read_file the DESIGN.md at the
path shown and apply it verbatim — it already contains the agent prompt guide.
- If the user names a brand NOT in the index, tell them it's not in the library and
either (a) fall back to the closest match by category, or (b) ask if they want a
generic design system instead. Do not fabricate a DESIGN.md.
- Do NOT copy the DESIGN.md into the project unless the user asks. Just read it and
follow its rules when generating UI.
Categories (for fallback matching)
- AI & LLM Platforms: claude, cohere, elevenlabs, minimax, mistral.ai, ollama,
opencode.ai, replicate, runway, together.ai, voltagent, x.ai
- Developer Tools & IDEs: cursor, expo, lovable, raycast, superhuman, vercel, warp
- Backend, Database & DevOps: clickhouse, composio, hashicorp, mongodb, posthog,
sanity, sentry, supabase
- Productivity & SaaS: cal, intercom, linear, mintlify, notion, resend, zapier
- Design & Creative Tools: airtable, clay, figma, framer, miro, webflow
- Fintech & Crypto: binance, coinbase, kraken, mastercard, revolut, stripe, wise
- E-commerce & Retail: airbnb, meta, nike, shopify, starbucks
- Media & Consumer Tech: apple, hp, ibm, nvidia, pinterest, playstation, spacex,
spotify, theverge, uber, vodafone, wired
- Automotive: bmw, bmw-m, bugatti, ferrari, lamborghini, renault, tesla
- Retro Web: dell-1996, nintendo-2001
Full index (site → path)
For any <site> below, the DESIGN.md is at
~/dev/forks/JZKK720/awesome-design-md/design-md/<site>/DESIGN.md.
ai-&-llm-platforms: claude, cohere, elevenlabs, minimax, mistral.ai, ollama,
opencode.ai, replicate, runway, together.ai, voltagent, x.ai
developer-tools: cursor, expo, lovable, raycast, superhuman, vercel, warp
backend-devops: clickhouse, composio, hashicorp, mongodb, posthog, sanity, sentry,
supabase
productivity-saas: cal, intercom, linear, mintlify, notion, resend, zapier
design-creative: airtable, clay, figma, framer, miro, webflow
fintech-crypto: binance, coinbase, kraken, mastercard, revolut, stripe, wise
ecommerce-retail: airbnb, meta, nike, shopify, starbucks
media-consumer: apple, hp, ibm, nvidia, pinterest, playstation, spacex, spotify,
theverge, uber, vodafone, wired
automotive: bmw, bmw-m, bugatti, ferrari, lamborghini, renault, tesla
retro-web: dell-1996, nintendo-2001
Notes
- The DESIGN.md files are extracted from public CSS values of public websites. The
repo's LICENSE (MIT) explicitly states these are provided "as is" and do not claim
ownership of any site's visual identity.
- The library is a fork mirror, not a dependency. Updating means
git pull in the
fork dir; the index above is a snapshot of what was present at install time.
- If a site the user names is missing, the upstream repo accepts requests at
https://getdesign.md/request — but do not make requests on the user's behalf.
1---2name: design-md-library3description: Curated library of 74 real-world DESIGN.md files (Google Stitch spec) extracted from sites like Apple, Stripe, Linear, Vercel, Notion, Airbnb. USE WHEN the user wants a design system to ground UI generation, says "make it look like [brand]", "use the [brand] design system", wants to build a page matching a known site's visual language, asks for design tokens/colors/typography for a named brand, or references DESIGN.md / Stitch / VoltAgent awesome-design-md. Returns the path to the matching DESIGN.md so the agent can read and apply it. Not a generator itself — it's an index into the fork mirror at ~/dev/forks/JZKK720/awesome-design-md/design-md/.4---56# design-md-library78Index into the **awesome-design-md** collection (VoltAgent/awesome-design-md, MIT).974 `DESIGN.md` files extracted from real websites, each following the Google Stitch10DESIGN.md spec (9 sections: visual theme, color palette, typography, components,11layout, depth, do/don'ts, responsive, agent prompt guide).1213## Where the files live1415The fork mirror is at:1617```18~/dev/forks/JZKK720/awesome-design-md/design-md/<site>/DESIGN.md19```2021Each `<site>/` dir also has a `README.md` with a one-line description. Read the22`DESIGN.md` for the full design system; the README is just a label.2324## How to use25261. Identify the brand/site the user wants to emulate (e.g. "make it look like Stripe",27 "use the Linear design system", "build a page in the Vercel style").282. Check if that site is in the index below. If yes, `read_file` the DESIGN.md at the29 path shown and apply it verbatim — it already contains the agent prompt guide.303. If the user names a brand NOT in the index, tell them it's not in the library and31 either (a) fall back to the closest match by category, or (b) ask if they want a32 generic design system instead. Do not fabricate a DESIGN.md.334. Do NOT copy the DESIGN.md into the project unless the user asks. Just read it and34 follow its rules when generating UI.3536## Categories (for fallback matching)3738- **AI & LLM Platforms:** claude, cohere, elevenlabs, minimax, mistral.ai, ollama,39 opencode.ai, replicate, runway, together.ai, voltagent, x.ai40- **Developer Tools & IDEs:** cursor, expo, lovable, raycast, superhuman, vercel, warp41- **Backend, Database & DevOps:** clickhouse, composio, hashicorp, mongodb, posthog,42 sanity, sentry, supabase43- **Productivity & SaaS:** cal, intercom, linear, mintlify, notion, resend, zapier44- **Design & Creative Tools:** airtable, clay, figma, framer, miro, webflow45- **Fintech & Crypto:** binance, coinbase, kraken, mastercard, revolut, stripe, wise46- **E-commerce & Retail:** airbnb, meta, nike, shopify, starbucks47- **Media & Consumer Tech:** apple, hp, ibm, nvidia, pinterest, playstation, spacex,48 spotify, theverge, uber, vodafone, wired49- **Automotive:** bmw, bmw-m, bugatti, ferrari, lamborghini, renault, tesla50- **Retro Web:** dell-1996, nintendo-20015152## Full index (site → path)5354For any `<site>` below, the DESIGN.md is at55`~/dev/forks/JZKK720/awesome-design-md/design-md/<site>/DESIGN.md`.5657ai-&-llm-platforms: claude, cohere, elevenlabs, minimax, mistral.ai, ollama,58opencode.ai, replicate, runway, together.ai, voltagent, x.ai59developer-tools: cursor, expo, lovable, raycast, superhuman, vercel, warp60backend-devops: clickhouse, composio, hashicorp, mongodb, posthog, sanity, sentry,61supabase62productivity-saas: cal, intercom, linear, mintlify, notion, resend, zapier63design-creative: airtable, clay, figma, framer, miro, webflow64fintech-crypto: binance, coinbase, kraken, mastercard, revolut, stripe, wise65ecommerce-retail: airbnb, meta, nike, shopify, starbucks66media-consumer: apple, hp, ibm, nvidia, pinterest, playstation, spacex, spotify,67theverge, uber, vodafone, wired68automotive: bmw, bmw-m, bugatti, ferrari, lamborghini, renault, tesla69retro-web: dell-1996, nintendo-20017071## Notes7273- The DESIGN.md files are extracted from public CSS values of public websites. The74 repo's LICENSE (MIT) explicitly states these are provided "as is" and do not claim75 ownership of any site's visual identity.76- The library is a fork mirror, not a dependency. Updating means `git pull` in the77 fork dir; the index above is a snapshot of what was present at install time.78- If a site the user names is missing, the upstream repo accepts requests at79 https://getdesign.md/request — but do not make requests on the user's behalf.
JZKK720