# DESIGN.md Curated Reference Catalog

Curated local DESIGN.md reference snapshots from `VoltAgent/awesome-design-md`, pinned to commit `f2d6b17d0dd706c9b0942674e6a6a782652cb127`.

Selection tags: `terminal-native`, `dark-product`, `developer-platform`, `editorial-minimal`, `commerce-polish`, `consumer-premium`, `design-tool`.

Use these snapshots as reference material only. Pick one primary reference, and one secondary reference only when it adds a distinct trait. Extract portable traits instead of copying a brand system.

## AI and developer tools

| Slug | Local snapshot | Upstream source | Primary feel | Best fit | Avoid when | Transferable patterns |
| --- | --- | --- | --- | --- | --- | --- |
| `opencode.ai` | `grok-toolkit/reference/design-md/examples/opencode.ai/DESIGN.md` | [raw](https://raw.githubusercontent.com/VoltAgent/awesome-design-md/f2d6b17d0dd706c9b0942674e6a6a782652cb127/design-md/opencode.ai/DESIGN.md) | `terminal-native`, `editorial-minimal` - cream terminal manual with mono-only UI. | CLI, terminal, or code-agent landing pages. | Image-led lifestyle marketing or color-rich dashboards. | Monospace hierarchy; bracket markers; one dark terminal hero; plain text rhythm. |
| `voltagent` | `grok-toolkit/reference/design-md/examples/voltagent/DESIGN.md` | [raw](https://raw.githubusercontent.com/VoltAgent/awesome-design-md/f2d6b17d0dd706c9b0942674e6a6a782652cb127/design-md/voltagent/DESIGN.md) | `dark-product`, `developer-platform` - near-black agent platform with one electric accent. | Agent tooling, developer platforms, and docs-marketing hybrids. | Light editorial brands or playful consumer onboarding. | Hairline dark cards; code mockups; single accent CTA; technical trust cues. |
| `cursor` | `grok-toolkit/reference/design-md/examples/cursor/DESIGN.md` | [raw](https://raw.githubusercontent.com/VoltAgent/awesome-design-md/f2d6b17d0dd706c9b0942674e6a6a782652cb127/design-md/cursor/DESIGN.md) | `dark-product`, `developer-platform` - editor-native AI coding polish. | IDE add-ons, AI coding surfaces, and command-palette flows. | Non-technical funnels or warm consumer education. | Editor panels; compact controls; keyboard-first value framing; focused dark contrast. |
| `claude` | `grok-toolkit/reference/design-md/examples/claude/DESIGN.md` | [raw](https://raw.githubusercontent.com/VoltAgent/awesome-design-md/f2d6b17d0dd706c9b0942674e6a6a782652cb127/design-md/claude/DESIGN.md) | `editorial-minimal`, `consumer-premium` - calm AI assistant editorial system. | Trust-heavy AI assistants, explainable workflows, and polished onboarding. | Dense dashboards, loud launches, or gamer-dark brands. | Warm neutrals; restrained type; conversational section rhythm; soft contrast. |

## Productivity and SaaS

| Slug | Local snapshot | Upstream source | Primary feel | Best fit | Avoid when | Transferable patterns |
| --- | --- | --- | --- | --- | --- | --- |
| `linear.app` | `grok-toolkit/reference/design-md/examples/linear.app/DESIGN.md` | [raw](https://raw.githubusercontent.com/VoltAgent/awesome-design-md/f2d6b17d0dd706c9b0942674e6a6a782652cb127/design-md/linear.app/DESIGN.md) | `dark-product`, `developer-platform` - focused issue-tracking OS with sharp hierarchy. | SaaS workflow products, command centers, and high-density operations tools. | Playful retail, rich media storytelling, or broad consumer education. | Dense product panels; thin dividers; keyboard speed; gradient restraint. |
| `vercel` | `grok-toolkit/reference/design-md/examples/vercel/DESIGN.md` | [raw](https://raw.githubusercontent.com/VoltAgent/awesome-design-md/f2d6b17d0dd706c9b0942674e6a6a782652cb127/design-md/vercel/DESIGN.md) | `developer-platform`, `editorial-minimal` - monochrome deployment platform with crisp proof. | Cloud tooling, build platforms, and developer trust pages. | Warm lifestyle brands or commerce pages that need emotional color. | Black-white contrast; sharp cards; metric proof; docs-grade spacing. |
| `supabase` | `grok-toolkit/reference/design-md/examples/supabase/DESIGN.md` | [raw](https://raw.githubusercontent.com/VoltAgent/awesome-design-md/f2d6b17d0dd706c9b0942674e6a6a782652cb127/design-md/supabase/DESIGN.md) | `developer-platform`, `dark-product` - open-source app platform with green technical energy. | Database, auth, and platform products that need code plus dashboard clarity. | Premium consumer brands or minimal editorial pages. | Green accent system; dark docs surfaces; product screenshots; modular cards. |
| `notion` | `grok-toolkit/reference/design-md/examples/notion/DESIGN.md` | [raw](https://raw.githubusercontent.com/VoltAgent/awesome-design-md/f2d6b17d0dd706c9b0942674e6a6a782652cb127/design-md/notion/DESIGN.md) | `editorial-minimal`, `consumer-premium` - document-first workspace clarity. | Knowledge tools, productivity suites, and simple collaboration pages. | High-urgency conversion pages or dense technical dashboards. | Document rhythm; soft grids; friendly icons; calm type scale. |

## Commerce and fintech

| Slug | Local snapshot | Upstream source | Primary feel | Best fit | Avoid when | Transferable patterns |
| --- | --- | --- | --- | --- | --- | --- |
| `stripe` | `grok-toolkit/reference/design-md/examples/stripe/DESIGN.md` | [raw](https://raw.githubusercontent.com/VoltAgent/awesome-design-md/f2d6b17d0dd706c9b0942674e6a6a782652cb127/design-md/stripe/DESIGN.md) | `commerce-polish`, `developer-platform` - polished fintech with technical depth. | Payments, billing, fintech APIs, and conversion-heavy B2B SaaS. | Bare terminal products or strict monochrome docs. | Layered gradients; crisp cards; trust metrics; API plus business split. |
| `shopify` | `grok-toolkit/reference/design-md/examples/shopify/DESIGN.md` | [raw](https://raw.githubusercontent.com/VoltAgent/awesome-design-md/f2d6b17d0dd706c9b0942674e6a6a782652cb127/design-md/shopify/DESIGN.md) | `commerce-polish`, `consumer-premium` - polished retail platform energy. | Commerce tooling, storefront builders, marketplace pages, and seller onboarding. | Deep technical tools or sparse developer documentation. | Merchant storytelling; bright CTA rhythm; product-commerce proof; approachable cards. |

## Design and consumer polish

| Slug | Local snapshot | Upstream source | Primary feel | Best fit | Avoid when | Transferable patterns |
| --- | --- | --- | --- | --- | --- | --- |
| `figma` | `grok-toolkit/reference/design-md/examples/figma/DESIGN.md` | [raw](https://raw.githubusercontent.com/VoltAgent/awesome-design-md/f2d6b17d0dd706c9b0942674e6a6a782652cb127/design-md/figma/DESIGN.md) | `design-tool`, `consumer-premium` - collaborative creative tool with playful precision. | Design tools, creative collaboration, and visual workflow products. | Severe enterprise dashboards or terminal-native experiences. | Canvas metaphors; colorful accents; collaboration cues; flexible layout blocks. |
| `apple` | `grok-toolkit/reference/design-md/examples/apple/DESIGN.md` | [raw](https://raw.githubusercontent.com/VoltAgent/awesome-design-md/f2d6b17d0dd706c9b0942674e6a6a782652cb127/design-md/apple/DESIGN.md) | `consumer-premium`, `editorial-minimal` - premium consumer product storytelling. | Hardware, polished apps, and high-trust consumer launches. | Developer docs, admin tools, or pages that need dense comparison data. | Large whitespace; confident typography; product-first sequencing; premium restraint. |