design-consultation

Generate a complete design system with tokenized typography, color, spacing, motion, and DESIGN.md.

46|13|Updated Jul 30, 2025
One-click install
npx skills add https://github.com/aimasteracc/tree-sitter-analyzer --skill design-consultation-aimasteracc
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: design-consultation
Source: https://github.com/aimasteracc/tree-sitter-analyzer/tree/main/.claude/skills/design-consultation
Command: npx skills add https://github.com/aimasteracc/tree-sitter-analyzer --skill design-consultation-aimasteracc

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Creating a cohesive, scalable design system and a single DESIGN.md as the project’s source of truth, so teams speak the same visual language and move faster.

Core Features & Use Cases

  • Generate a complete design system including typography, color, spacing, motion, and tokens.
  • Produce DESIGN.md as the central reference document for designers and developers.
  • Use for new products, redesigns, or brand refreshes to accelerate alignment and handoff.

Quick Start

Generate a complete design system and DESIGN.md for your project with a single request.

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 cohesive design system for a new web or mobile product?

A cohesive design system requires tokenized typography, color, spacing, and motion guidelines to ensure visual consistency. This skill generates a complete design language and a central DESIGN.md document to serve as your project's single source of truth for scalable interfaces.

What is a DESIGN.md file and how does it help with design handoff?

A DESIGN.md file is a central reference document that captures your entire design system, including typography, color, and component guidelines. It aligns designers and developers around a shared visual vocabulary, accelerating handoff and ensuring scalable visual consistency.

Can I generate design tokens for typography, color, and spacing automatically?

Yes, generating design tokens for typography, color, spacing, and motion is a core feature. The skill produces tokenized guidelines alongside a comprehensive DESIGN.md document to establish a unified visual language for web and mobile interfaces.

Does this work for a brand refresh or a complete product redesign?

Yes, this approach is built for new products, redesigns, and brand refreshes across web and mobile interfaces. It delivers a complete design system with tokenized typography, color, spacing, motion, and component guidelines to ensure visual consistency.

How do I start building a design system if our team lacks a shared visual vocabulary?

Start by generating a complete design system with a single request to produce a central DESIGN.md file. This establishes tokenized typography, color, spacing, and motion guidelines, giving your team a shared visual vocabulary and a single source of truth.

What is the best way to maintain visual consistency across web and mobile interfaces?

The best way to maintain visual consistency is to establish a single source of truth like a DESIGN.md file. It defines tokenized typography, color, spacing, and motion guidelines, ensuring teams speak the same visual language across scalable web and mobile interfaces.