design-consultation

Generates a complete design system proposal and DESIGN.md through product research and consultation.

2|Updated Mar 26, 2026
One-click install
npx skills add https://github.com/westkite1201/garden-engine --skill design-consultation-westkite1201
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: design-consultation
Source: https://github.com/westkite1201/garden-engine/tree/main/.claude/skills/gstack/design-consultation
Command: npx skills add https://github.com/westkite1201/garden-engine --skill design-consultation-westkite1201

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Starting a new project's UI without a design system leads to inconsistent, generic-looking interfaces. This Skill acts as a design consultant that researches your product landscape, proposes a coherent design system covering aesthetic, typography, color, layout, spacing, and motion, and writes DESIGN.md as your project's design source of truth. ## Core Features & Use Cases - Complete Design Proposal: Proposes aesthetic direction, font stacks, color palettes with hex values, spacing systems, and motion approaches as one coherent package with SAFE/RISK breakdowns. - Competitive Research: Optionally researches top products in your space via WebSearch and headless browser screenshots to identify category conventions and differentiation opportunities. - Outside Design Voices: Runs parallel design critiques from Codex and a Claude subagent, synthesizing agreements and divergences into creative alternatives. - Use Case: You are starting a new SaaS dashboard with no brand guidelines. Run this Skill to get a researched, opinionated design system with font and color preview pages, saved as DESIGN.md for all future UI work. ## Quick Start Ask the assistant to run the design-consultation skill to create a design system and DESIGN.md for your new project.

Frequently Asked Questions about design-consultation

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create a design system for a new project?

Run the design-consultation skill, which gathers product context, optionally researches competitors in your space, and proposes a complete system covering aesthetic, typography, color, layout, spacing, and motion. The result is written to DESIGN.md as your project's design source of truth.

What is DESIGN.md and when should I generate one?

DESIGN.md is a design source-of-truth file containing your project's aesthetic direction, fonts, colors, and spacing rules. Generate one when starting a new project's UI with no existing design system, before writing any frontend code.

Can I use this skill on a project that already has a design system?

If a DESIGN.md already exists, the skill asks whether you want to update it, start fresh, or cancel. For inferring a design system from an existing live site, use the plan-design-review skill instead.

Does the design research require a browser or internet access?

No, research is optional and degrades gracefully. With the browse binary it captures screenshots and snapshots; without it the skill falls back to WebSearch, and if that is unavailable it relies on built-in design knowledge.

What fonts does the skill avoid recommending?

The skill blacklists decorative fonts like Papyrus, Comic Sans, and Lobster, and avoids overused defaults like Inter, Roboto, Arial, Helvetica, and Poppins as primary choices. It recommends distinctive alternatives such as Satoshi, Instrument Serif, and Fraunces.