Design Brief

Turns vague design requests into structured specs by forcing you to resolve eight dimensions up front: palette, typography, layout, mood, density, accent color, and constraints. You can feed it natural language ("clean dark landing page, Inter font, no animations") and it converts that to I-Lang format, then spits out a DESIGN.md with concrete hex values, spacing tokens, and font specs. Built by analyzing 71 design systems to find the minimum set of decisions you actually need to make before pushing pixels. Useful when you're tired of iterating on "make it feel more professional" and want to lock down the visual system before touching components.

skills.sh installs: 3.6K
GitHub stars: 106.9K
last updated: Aug 21, 2026

View on GitHub

Install

$ npx -y skills add nexu-io/open-design --skill design-brief --agent claude-code

Installs into .claude/skills of the current project.

Files

Design Brief Skill

Parse a structured design brief into a concrete DESIGN.md and optional visual preview. Agent, follow this workflow exactly.

Background

The 8 dimensions in this skill were derived from OpenDesign's original 71-system catalog; 71 is the research sample, not the current bundled-system count. Every DESIGN.md in design-systems/ still resolves at minimum: color palette, accent, typography, display font, layout model, and component style. We distilled these into 8 orthogonal dimensions that cover the decisions a designer makes before any pixel is placed. Mood and density were added because they are the two most common sources of ambiguity in natural language briefs ("make it clean" means different things to different people).

Dimensions intentionally excluded from the brief level: animation timing, responsive strategy, and accessibility contrast. These are enforced at the template level by individual skills (e.g., saas-landing handles its own responsive logic), though the generated DESIGN.md includes sensible breakpoint defaults for downstream consumption.