skills.rest
256javy
256javyCOMMUNITY
Explore all skills by this author →
𝕏@NelsonChess666GitHub

design-consultation

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

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

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Design teams often struggle to articulate and codify a design system from a product brief. This skill understands your product, researches the landscape, proposes typography, color, layout, spacing, and motion, and outputs a complete DESIGN.md as the single source of truth.

Core Features & Use Cases

  • Complete design system blueprint including typography, color, layout, spacing, and motion
  • Generates DESIGN.md as the project-wide source of truth to guide implementation
  • Produces font and color previews to visualize the system and enable quick reviews

Quick Start

Run the design-consultation skill to generate a complete design system blueprint and DESIGN.md 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 complete design system from a product brief?▼

A design system blueprint codifies typography, color, layout, spacing, and motion into a single source of truth. It generates a project-wide DESIGN.md file to guide implementation for new product UI projects or revamps.

What is the best way to document branding and design tokens for a new UI project?▼

The best way to document branding and design tokens is by generating a DESIGN.md file as the project-wide source of truth. It specifies typography, color, layout, and motion while providing font and color previews for quick reviews.

How do I generate a design specification that includes typography, color, and motion?▼

Generate a design specification by researching product goals and the landscape to propose typography, color, layout, spacing, and motion. This produces a complete design system blueprint and a DESIGN.md to guide implementation.

Can I use a generated design system blueprint for a product UI revamp?▼

Yes, a generated design system blueprint applies to both new product UI projects and revamps. It researches the landscape to propose typography, color, layout, and motion, delivering a DESIGN.md as the single source of truth.

Do I need a DESIGN.md file to guide my design system implementation?▼

You need a DESIGN.md file to serve as the project-wide source of truth for your design system implementation. It articulates and codifies typography, color, layout, spacing, and motion to align development with your design language.

Related Skills

Explore More Design & Creative Skills→
SakshamKandelSakshamKandel

design-consultation

Propose an end-to-end design system with tokens, documentation, and a live preview.

Community
Advanced
louisfghbvclouisfghbvc
4

design-consultation

Generate a complete design system with typography, color, layout, and motion tokens.

Community
Advanced
ralphjohn29ralphjohn29
1

ui-ux-pro-max

Provide UI/UX design recommendations for React, Next.js, Vue, and SwiftUI.

Community
Advanced
TugoukezhangTugoukezhang
8

awesome-design-md

Load a brand-specific DESIGN.md from references/ and output it to the project root.

Community
Intermediate