skills.rest
stayconnectquick
stayconnectquickCOMMUNITY
Explore all skills by this author →
GitHub

design-consultation

Generate a DESIGN.md design system covering typography, color, spacing, layout, and motion.

Updated May 6, 2026
Search Tags:#design#ui-design#ux#design-system#design-docs#brand-guidelines
One-click install
npx skills add https://github.com/stayconnectquick/gstack --skill design-consultation-stayconnectquick
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-consultation
Source: https://github.com/stayconnectquick/gstack/tree/main/design-consultation
Command: npx skills add https://github.com/stayconnectquick/gstack --skill design-consultation-stayconnectquick

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Converts abstract product requirements into a concrete, maintainable design system by generating a DESIGN.md that serves as the single source of truth for typography, color, spacing, layout, and motion decisions.

Core Features & Use Cases

  • Understands the product and landscape, then proposes a complete design system including typography, color, layout, spacing, and motion.
  • Generates DESIGN.md as your project's canonical design source of truth and provides font and color previews to aid review.
  • Provides proactive guidance for new UI projects and for existing sites where a design system or DESIGN.md is missing, or needs revision.

Quick Start

Proactively initiate a full design-system plan for a new project and request DESIGN.md generation.

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 product from scratch?▼

You can infer a complete design system from an existing site by generating a DESIGN.md. This process reverse-engineers typography, color, spacing, layout, and motion decisions into a maintainable source of truth.

What is a DESIGN.md file and why do I need it for UI design?▼

A DESIGN.md file acts as the single source of truth for your project's design system. It consolidates typography, color, spacing, layout, and motion decisions to maintain consistency across UI planning and brand guidelines.

How do I document brand guidelines and UI design decisions in one place?▼

No, you do not need existing design docs to start. This Skill can proactively initiate a full design-system plan for new projects by understanding the product landscape and proposing a complete aesthetic framework.

Can I generate typography and color previews when building a design system?▼

This Skill handles both new projects missing a design system and existing sites needing an inferred system. It ensures typography, color, spacing, layout, and motion decisions are consistently documented.

Related Skills

Explore More Design & Creative Skills→
jimiryquaijimiryquai

teach-impeccable

Analyze codebase and branding assets to write design context to .impeccable.md.

Community
Intermediate
anonymouswhite07anonymouswhite07

stitch-design-taste

Generate DESIGN.md specifications for Google Stitch from design taste rules.

Community
Advanced
AshesOfTheUndeadAshesOfTheUndead

expressive

Generate design guideline documents for UI components using color, typography, and spacing tokens.

Community
Intermediate
shhubbhshhubbh
1

design-consultation

Generate a DESIGN.md documenting typography, color palettes, layout, spacing, and motion guidelines.

Community
Advanced