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.