design-cli

Lint DESIGN.md files and export design tokens to Tailwind or DTCG JSON.

4|Updated Jun 10, 2026
One-click install
npx skills add https://github.com/mymx2/foreman --skill design-cli
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-cli
Source: https://github.com/mymx2/foreman/tree/main/.agents/skills/design-cli
Command: npx skills add https://github.com/mymx2/foreman --skill design-cli

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires @google/design.md.

What problem does it solve?

This skill addresses the fragmentation between design intent and implementation by providing a standardized, machine-readable format for design systems that ensures consistency across AI-generated code and UI components.

Core Features & Use Cases

  • Design System Validation: Automatically lint DESIGN.md files to catch broken token references, accessibility (WCAG) contrast issues, and structural errors.
  • Token Regression Testing: Compare two versions of a design system to identify token-level changes and potential regressions before they impact the UI.
  • Multi-Format Export: Convert design tokens into Tailwind v3/v4 configurations or W3C-compliant DTCG JSON tokens for seamless integration into development workflows.

Quick Start

Use the design-cli skill to lint the current DESIGN.md file and report any structural or accessibility findings.

Frequently Asked Questions about design-cli

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I lint a DESIGN.md file for accessibility and structural errors?▼

Lint a DESIGN.md file using the design-cli to automatically catch broken token references, WCAG contrast issues, and structural schema errors. This ensures your design system specifications maintain accessibility standards and structural integrity before UI implementation.

Can I export design tokens to Tailwind v3 or v4 configurations?▼

Export design tokens to Tailwind v3 or v4 configurations using the design-cli multi-format export feature. Convert colors, typography, and component variants from your DESIGN.md files into framework-specific configurations for seamless integration into your development workflows.

How do I compare two versions of a design system to identify token regressions?▼

Compare two versions of a design system using the design-cli diffing functionality to identify token-level changes and potential regressions. This detects modifications in colors, typography, and component variants before they impact the UI implementation.

Does the design-cli generate W3C-compliant DTCG JSON tokens?▼

The design-cli generates W3C-compliant DTCG JSON tokens during multi-format export. Convert your DESIGN.md specifications into standardized JSON tokens to ensure cross-platform compatibility and consistent UI implementation across different development environments.

What is a DESIGN.md file and when do I need it for design system validation?▼

A DESIGN.md file is a standardized, machine-readable format for defining design system specifications including colors, typography, and component variants. You need it when bridging the gap between design intent and implementation to ensure consistency across AI-generated code.

Why does my design system have broken token references and accessibility contrast issues?▼

Broken token references and accessibility contrast issues occur when design system specifications deviate from structural schemas or WCAG standards. Use the design-cli linting feature to automatically detect and report these errors in your DESIGN.md files.