skills.rest
bananaduck1
bananaduck1COMMUNITY
Explore all skills by this author →
GitHub

design-consultation

Generate a design system plan and DESIGN.md with font and color previews.

Updated Aug 23, 2026
Search Tags:#typography#branding#layout#design-system#motion#color-palette
One-click install
npx skills add https://github.com/bananaduck1/storylab --skill design-consultation-bananaduck1
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-consultation
Source: https://github.com/bananaduck1/storylab/tree/main/.claude/skills/gstack/design-consultation
Command: npx skills add https://github.com/bananaduck1/storylab --skill design-consultation-bananaduck1

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Inconsistent visuals and design drift slow product teams. This skill understands your product, researches the landscape, and proposes a complete design system—covering aesthetic, typography, color, layout, spacing, and motion—and generates a DESIGN.md as the project’s design source of truth. For existing sites, use /plan-design-review to infer the system.

Core Features & Use Cases

  • Proposes a full design system that defines aesthetic, typography, color, layout, spacing, and motion.
  • Generates font and color preview pages to visualize the system.
  • Creates DESIGN.md as your project's design source of truth and supports a plan-design-review for existing sites.
  • Boots design work for new products with actionable guidelines that teams can implement quickly.

Quick Start

Provide a product overview and I will generate a complete design system and a DESIGN.md as the single source of truth.

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 for a new product?▼

To create a complete design system for a new product, provide a product overview to generate actionable guidelines covering typography, color, layout, spacing, and motion, resulting in a DESIGN.md as the single source of truth.

Can I infer a design system from an existing website?▼

Yes, you can infer a design system from an existing website by using a plan-design-review process to extract typography, color, spacing, and motion guidelines, producing a comprehensive design system plan and DESIGN.md.

What is a DESIGN.md file for design systems?▼

A DESIGN.md file serves as a project's single source of truth for design, documenting the complete design system including aesthetic, typography, color, layout, spacing, and motion guidelines to prevent visual inconsistency and design drift.

How do I generate typography and color palette guidelines for my UI?▼

Generate typography and color palette guidelines by inputting your product overview to produce a design system that includes visual font and color preview pages, ensuring consistent UI implementation across your team.

What is the best way to document motion and layout guidelines for a design system?▼

The best way to document motion and layout guidelines is to research the product landscape and output a DESIGN.md file, capturing all spacing and motion rules to serve as the definitive design source of truth.

Can I use this to fix inconsistent visuals and design drift in my project?▼

Yes, you can fix inconsistent visuals and design drift by generating a comprehensive design system that defines typography, color, layout, spacing, and motion, establishing a DESIGN.md to align your product team.

Related Skills

Explore More Design & Creative Skills→
OzeroHAXOzeroHAX
32

project-standart-prd

Generates a Product Requirements Document with functional and non-functional requirements and testable acceptance criteria.

Community
Intermediate
HanHan666666HanHan666666
10

frontend-design

Design and implement frontend interfaces with design tokens and responsive guidelines.

Community
Advanced
whd4whd4

design-consultation

Plan a complete design system and output a DESIGN.md with font and color previews.

Community
Advanced
sanky369sanky369
29

creative-strategist

Define brand visual direction and generate mood boards and style guides.

Community
Advanced