skills.rest
jonkiky
jonkikyCOMMUNITY
Explore all skills by this author →
GitHub

design-consultation

Propose a cohesive design system and generate DESIGN.md.

Updated Apr 2, 2026
Search Tags:#typography#branding#layout#color#design-system#motion
One-click install
npx skills add https://github.com/jonkiky/ccdi-federation-ai --skill design-consultation-jonkiky
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-consultation
Source: https://github.com/jonkiky/ccdi-federation-ai/tree/main/.agents/skills/design-consultation
Command: npx skills add https://github.com/jonkiky/ccdi-federation-ai --skill design-consultation-jonkiky

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Design consultation helps teams articulate and implement a cohesive design system for a product. It researches the landscape, proposes a unified aesthetic, typography, color, layout, spacing, and motion, and creates DESIGN.md as the project's design source of truth. It also offers guidance for existing sites using plan-design-review workflows and proactively suggests design-system guidance when starting new UI projects.

Core Features & Use Cases

  • Proposes a complete design system (aesthetic, typography, color, layout, spacing, motion) for a product.
  • Generates font and color preview pages and creates DESIGN.md as the design source of truth.
  • Supports plan-design-review workflows for existing sites and ongoing design-system evolution.

Quick Start

Ask me to design a complete design system for your project and I will generate DESIGN.md and preview pages.

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, you must define cohesive typography, color, layout, spacing, and motion guidelines. This process researches the landscape, proposes a unified aesthetic, and generates a DESIGN.md file to serve as the project's design source of truth.

What is a DESIGN.md file and how does it work for UI projects?▼

A DESIGN.md file acts as the central source of truth for a product's visual identity and UI rules. It documents the cohesive aesthetic, typography, color palettes, layout grids, spacing scales, and motion principles to ensure consistent implementation across the project.

Can I update an existing design system for an evolving product?▼

Yes, you can update an existing design system using a plan-design-review workflow. This approach evaluates your current UI, proposes system improvements for typography and color, and evolves the DESIGN.md file to reflect ongoing design-system changes accurately.

What's the best way to document brand guidelines and visual aesthetics?▼

The best way to document brand guidelines is to generate a comprehensive DESIGN.md file. It captures your unified aesthetic, typography, color, layout, spacing, and motion specifications, alongside font and color preview pages for visual reference.

Does a design system include motion and layout specifications?▼

Yes, a complete design system includes motion and layout specifications. It proposes a cohesive framework covering typography, color, layout grids, spacing scales, and motion principles to ensure comprehensive UI consistency and clear design rules.

Related Skills

Explore More Design & Creative Skills→
luanzebaluanzeba

teach-impeccable

Gather project design context and generate a CLAUDE.md Design Context document.

Community
Intermediate
anonymouswhite07anonymouswhite07

stitch-design-taste

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

Community
Advanced
nsuberinsuberi

normalize

Audit and realign UI components, spacing, tokens, and accessibility to a design system.

Community
Advanced
peterbamuhigirepeterbamuhigire
1

playbook-social-media-brand-style-guide

Generate a client-ready Brand Style Guide with voice, tone, and governance sections.

Community
Advanced