design-consultation

Create a complete design system and output DESIGN.md with typography, color, layout, spacing, and motion guidelines.

2|Updated Apr 4, 2026
One-click install
npx skills add https://github.com/adityasingh2400/SwarmSell --skill design-consultation-adityasingh2400
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-consultation
Source: https://github.com/adityasingh2400/SwarmSell/tree/main/.claude/skills/design-consultation
Command: npx skills add https://github.com/adityasingh2400/SwarmSell --skill design-consultation-adityasingh2400

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Product teams often struggle to achieve consistent UI across features and platforms. This Design Consultation skill proposes a complete design system that defines aesthetics, typography, color, layout, spacing, and motion, delivering a single source of truth and faster design-to-prod handoffs.

Core Features & Use Cases

  • Propose a complete design system (aesthetic, typography, color, layout, spacing, motion) and generate a DESIGN.md as the project's single source of truth.
  • For existing sites, infer the system using plan-design-review workflows and outline actionable guidelines, tokens, and components ready for implementation.
  • Produce font and color preview pages and a practical plan to bootstrap UI code, design files, and documentation.

Quick Start

Provide a project with no DESIGN.md and I will design a full system and deliver DESIGN.md with design tokens, typography scale, color palette, and component guidelines.

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 an existing product?▼

A design system centralizes typography, color, layout, spacing, and motion guidelines into a single source of truth. It ensures consistent UI across features and platforms, resolving visual discrepancies and accelerating the design-to-production handoff process.

What is the best way to document UI typography and color tokens?▼

The best way to document design tokens is by generating a DESIGN.md file as the single source of truth. This skill outputs concrete typography scales, color palettes, layout rules, and component guidelines to standardize your project.

Can I generate color and font previews for a new design system?▼

Yes, you can generate color and font previews for a new design system. This skill produces visual preview pages alongside a practical plan to bootstrap UI code, design assets, and documentation.

Does this design consultation skill work without an existing DESIGN.md file?▼

Yes, this skill works without an existing DESIGN.md file. For new projects, it proposes a complete system defining aesthetics and motion, delivering the missing DESIGN.md populated with design tokens and component guidelines.

How do I bootstrap UI code from a generated design system?▼

To bootstrap UI code from a design system, follow the concrete implementation plan in the output. This skill delivers a practical roadmap to translate your DESIGN.md tokens, typography, and color guidelines directly into functional UI code and design assets.