skills.rest
xotong
xotongCOMMUNITY
Explore all skills by this author →
GitHub

design-consultation

Plan and codify a design system into a DESIGN.md source of truth.

2|Updated May 8, 2026
Search Tags:#typography#ui-design#design-system#color-palette#brand-guidelines#design-architecture
One-click install
npx skills add https://github.com/xotong/claude-marketplace --skill design-consultation-xotong
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-consultation
Source: https://github.com/xotong/claude-marketplace/tree/main/plugins/gstack/skills/design-consultation
Command: npx skills add https://github.com/xotong/claude-marketplace --skill design-consultation-xotong

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Automates planning and creation of a cohesive design system, producing a DESIGN.md that codifies typography, color, layout, spacing, and motion for your project and serves as the design source of truth. It can infer a system for existing sites when DESIGN.md is absent and provides proactive guidance when starting new UI work.

Core Features & Use Cases

  • Research-driven system design: defines a cohesive aesthetic and component language, and generates a DESIGN.md to serve as the living source of truth.
  • Proactive design guidance: suggests brand guidelines and design-system decisions at project initiation or when upgrading existing sites without DESIGN.md.
  • Artifact generation: outputs a DESIGN.md plus design previews and guidelines for consistent implementation across teams.

Quick Start

Ask the assistant to generate a DESIGN.md that codifies your brand guidelines and design system for your 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 my project from scratch?▼

A design system codifies typography, color, layout, spacing, and motion guidelines into a DESIGN.md file, serving as the living source of truth for consistent UI implementation across your project.

What is a DESIGN.md file and when do I need one for brand guidelines?▼

A DESIGN.md file codifies your complete brand guidelines and design architecture into a source of truth. You need one when starting new UI work or upgrading an existing site to ensure cohesive aesthetics.

Can I infer a design system for an existing site without any documentation?▼

Yes, you can infer a design system for existing sites when DESIGN.md is absent. The system proactively analyzes the current UI to define a cohesive aesthetic and component language for your brand.

How do I codify typography and color palette rules for my UI?▼

You codify typography and color palette rules by planning a research-driven design architecture and outputting a DESIGN.md document that defines your component language and visual guidelines.

Does generating a design system include layout and motion previews?▼

Yes, generating a design system includes layout and motion previews. The process outputs a DESIGN.md alongside design previews and guidelines to ensure consistent implementation across teams.

Related Skills

Explore More Design & Creative Skills→
wpgauravwpgaurav
14

teach-impeccable

Gather project design context and persist it into a centralized AI config.

Community
Advanced
anonymouswhite07anonymouswhite07

stitch-design-taste

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

Community
Advanced
thanh-abaiithanh-abaii
34

gs:design-consultation

Generate design systems and a DESIGN.md file for Windows 11 projects.

Community
Advanced
benrapportbenrapport

design-consultation

Create a design system and generate a DESIGN.md document.

Community
Advanced