DESIGN.md writer (repo path)
By Karo
Category: Vibe Coding Prompts
Extract reusable design rules from an existing codebase.
Adapted and shared by Product with Attitude, with credit to superdesign.dev.
Prompt / skill content
Audit my repo before designing anything. Read package.json, my tailwind
config, globals.css, and 3 or 4 existing components. Then write a
DESIGN.md at the project root as rules you will follow every time:
- Fonts: display, body, mono. List the generic ones to NEVER use:
Inter, Roboto, Open Sans, Arial, system-ui.
- Color: ONE dominant color plus ONE accent, all as CSS variables.
Ban purple or indigo gradients on white.
- Spacing: an 8px rhythm. Type scale uses weight extremes (200 vs 800)
and size jumps of 3x, not 1.5x.
- Components: the shadcn/ui primitives plus the real components already
in my repo, with import paths, so you reuse instead of hand-rolling.
- Forbidden: three rounded cards in a row, centered-everything heroes,
0.1-opacity drop shadows on everything.
Do NOT generate UI yet. Write DESIGN.md, show it to me, and wait.
Where to get it
Read the original resource.
More in Vibe Coding Prompts
← Back to Attitude Vault