skills.rest
Ulanxx
UlanxxCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

design-consultation

Generate a complete design system proposal and DESIGN.md from product context.

Updated Mar 25, 2026
Search Tags:#typography#design#branding#ui-design#design-system#color-palette
One-click install
npx skills add https://github.com/Ulanxx/mzstack --skill design-consultation-ulanxx
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-consultation
Source: https://github.com/Ulanxx/mzstack/tree/main/design-consultation
Command: npx skills add https://github.com/Ulanxx/mzstack --skill design-consultation-ulanxx

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

Design teams often struggle to translate vague briefs into a cohesive, repeatable design system; this Skill generates a complete design system proposal and DESIGN.md that serves as a single source of truth.

Core Features & Use Cases

  • Proposes a complete design system (aesthetic, typography, color, layout, spacing, motion) and renders a font/color preview page.
  • Creates DESIGN.md as the project's design source of truth and provides guidance for existing sites to infer system components.
  • Phase-driven workflow including pre-checks, context gathering, competitive research, and a complete, decision-backed proposal with safe vs. risky choices and a preview option.

Quick Start

Provide a product context (brief description and target users) and I will generate a complete design system proposal and DESIGN.md.

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 complete design system from a vague product brief?▼

Creating a design system from a brief requires gathering product context and target user data to generate a cohesive DESIGN.md. This process proposes typography, color palettes, layout, and motion guidelines as a single source of truth.

Can I use this to refine typography and color for an existing website?▼

Yes, refining typography and color for an existing site works by inferring current system components and updating them. It provides guidance to extract and standardize existing layout, spacing, and aesthetic choices into a structured DESIGN.md.

What is a SAFE and RISK decision framework in design system generation?▼

A SAFE and RISK decision framework evaluates design system proposals by categorizing aesthetic and layout choices. It highlights safe, reliable design decisions versus risky, experimental options, helping teams preview and select components with clear trade-offs.

How to generate a DESIGN.md file that serves as a project's design source of truth?▼

Generating a DESIGN.md involves running phase-driven workflows including pre-checks, context gathering, and competitive research. The output is a comprehensive markdown file documenting typography, color, spacing, and motion alongside a preview-ready design proposal.

Does generating a design system proposal require an existing DESIGN.md file?▼

No, generating a design system proposal does not require an existing DESIGN.md. It applies to new projects with no existing design documentation by using initial product context to build the foundational design system from scratch.

What's the best way to standardize UI design components like spacing and motion for a new product?▼

Standardizing UI design components involves researching competitive context and product requirements to define repeatable rules. It generates a preview-ready proposal standardizing typography, color palettes, spacing, and motion into a unified system.

Related Skills

Explore More Design & Creative Skills→
TheCraigHewittTheCraigHewitt
7.3k

product-marketing-context

Create and maintain a product marketing context document at .claude/product-marketing-context.md.

Community
Intermediate
tsenseitsensei
3

design-consultation

Generate a complete design system with typography, color, layout, spacing, and motion guidelines in DESIGN.md.

Community
Advanced
balajivisbalajivis
2

design-consultation

Create a complete design system with typography, color strategy, and DESIGN.md output.

Community
Advanced
AndrewLi0420AndrewLi0420

design-consultation

Define a design system plan with DESIGN.md, CLAUDE.md, and a preview page.

Community
Advanced