I extracted design specifications from 13 companies and packaged them as skills that AI coding agents can follow.
The problem: AI generates inconsistent UIs because it doesn't have access to real design system constraints. "Build a dashboard like Linear" produces something that looks nothing like Linear.
The solution: Structured constraint documents in MUST/SHOULD/NEVER format containing:
- Semantic color tokens (not just hex codes)
- Typography scale with named styles
- Spacing grid
- Component specifications
- Interactive state treatments
Example constraint:
- MUST use #5E6AD2 as primary action color
- MUST use 4px grid for spacing
- SHOULD use 6px border-radius for interactive elements
- NEVER use pure black for backgrounds
ihlamury•1h ago
The problem: AI generates inconsistent UIs because it doesn't have access to real design system constraints. "Build a dashboard like Linear" produces something that looks nothing like Linear.
The solution: Structured constraint documents in MUST/SHOULD/NEVER format containing: - Semantic color tokens (not just hex codes) - Typography scale with named styles - Spacing grid - Component specifications - Interactive state treatments
Example constraint: - MUST use #5E6AD2 as primary action color - MUST use 4px grid for spacing - SHOULD use 6px border-radius for interactive elements - NEVER use pure black for backgrounds
Installation: `npx skills add ihlamury/design-skills`
Works with Claude Code, Cursor, Copilot, or paste into any AI chat.
Available: Linear, Stripe, Spotify, Notion, Discord, GitHub, Vercel, Robinhood, Slack, Airbnb, OpenAI, Anthropic, Mercury
https://github.com/ihlamury/design-skills