📋 Template: extrair DS do código
Read my GitHub repo [github.com/org/repo] and design files.
Extract my complete design system:
- Color palette (primary, secondary, neutral) — hex codes + OKLCH
- Typography — font stacks (headline, body, mono), weights, tracking
- Spacing scale (4/8/12/16/24/32/48/64 or my custom)
- Border radii (card, button, input, chip)
- Shadow levels (1-3 with offsets and blur)
- Main components (Button variants, Card, Input, Badge, Tabs)
- Voice and tone (do/don't examples)
AVOID: Inter, Roboto, Arial, Fraunces.
Suggest alternatives: Newsreader, Geist, Söhne, Reckless.
If palette is restrictive, derive harmonious colors using OKLCH
(maintain ~55% lightness for visual consistency).
OUTPUT: Generate DESIGN.md in my project root.
Also apply this system to any subsequent designs in this project.🎯 Template: apontar para competidor
Visit [linear.app] (or other reference URL).
Extract their visual system: palette, typography family,
density, spacing feel.
Generate a DESIGN.md DERIVED from this system (not copied):
- Use their palette approach but with my brand primary [#hex]
- Adopt their typography aesthetic (serif or sans direction)
- Match their density and spacing philosophy
Apply this to all designs I create in this project.🎨 Template: remix de dois sistemas
Create a hybrid DESIGN.md combining TWO aesthetic families:
SYSTEM A: [Linear] — ruthless content-first, minimal accent,
sans serif body, precise spacing
SYSTEM B: [A24 films] — cinematic moments, oversized typography,
generous breathing room, dramatic dark passages
HYBRID APPROACH:
- Linear's structure and density
- A24's tone and typographic moments
- Keep palette restrained (2-3 colors max)
- Add 1-2 hero moments per page with A24 treatment
Output DESIGN.md and apply it.📋 Extração de código real
System prompt diz: "Claude é melhor em recriar interfaces baseadas em código do que em screenshots." Apontar para repo é a maneira mais confiável.
🌐 Competidor como inspiração
Hack oficial da comunidade: aponte para site admirado. Web capture extrai padrões. Claude gera DS derivado (não copiado) — original mas inspirado.
🎨 Remix híbrido
Originalidade em 2026 vem de fusão. Linear × A24 = SaaS com alma. Stripe × A24 = fintech cinematográfico. Warp × Sentry = devtool com personalidade.
🎨 OKLCH para expandir paleta
Marca só te dá 2 cores? Peça OKLCH derivation com L~55% fixo — Claude cria paleta de 6 harmônicas a partir das 2.
🔤 Font stacks anti-overused
System prompt lista Inter, Roboto, Arial, Fraunces como "overused". Peça alternativas: Newsreader, Reckless, Geist, Söhne, Basis Grotesque, Instrument Serif.
📜 Versionar como código
DESIGN.md em git. Tags v1, v2. CHANGELOG.md. Rebranding futuro não quebra projetos legados.