design-md

Generate and validate DESIGN.md design tokens with YAML front matter and WCAG checks.

Updated May 3, 2026

Search Tags:#design #wcag #lint #export #design-tokens #design-md

Ready to run

npx skills add https://github.com/JuanMS20/solviora-agent --skill design-md-juanms20

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: design-md
Source: https://github.com/JuanMS20/solviora-agent/tree/main/skills/creative/design-md
Command: npx skills add https://github.com/JuanMS20/solviora-agent --skill design-md-juanms20

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

DESIGN.md provides a structured, machine-readable design-token spec that combines tokens and rationale for consistent UI systems and automated validation.

Core Features & Use Cases

Lint and validate DESIGN.md files to enforce structure and token references
Diff versions to track visual system evolution and maintain consistency across projects
Export tokens to Tailwind theme JSON or W3C DTCG JSON for cross-platform tooling
Port or extend a design system from existing specs to new projects and tooling

Quick Start

Create a DESIGN.md for your project and run the CLI to lint and export tokens.

Frequently Asked Questions about design-md

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

FAQPage Schema

How do I export design tokens to Tailwind theme JSON?▼

You can export design tokens to Tailwind theme JSON by authoring a DESIGN.md file and running the CLI export function. This generates a structured theme JSON file for cross-platform tooling integration.

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

A DESIGN.md file is a structured, machine-readable design-token specification that combines tokens and rationale. You need it when creating, auditing, or porting a design specification to maintain consistent UI systems.

How do I lint design tokens and check WCAG compliance automatically?▼

You lint design tokens and check WCAG compliance by running the validation CLI on your DESIGN.md file. It enforces required YAML front matter fields, performs structural linting, and executes WCAG checks.

Can I diff design token versions to track visual system evolution?▼

Yes, you can diff design token versions to track visual system evolution. The diffing functionality compares DESIGN.md versions to maintain consistency and track changes across projects.

Does the W3C DTCG JSON format work for exporting design tokens?▼

Yes, W3C DTCG JSON works for exporting design tokens. The export function supports converting your DESIGN.md token specification into W3C DTCG JSON format for cross-platform tooling compatibility.

What's the best way to port a design system to a new project?▼

The best way to port a design system is to use a DESIGN.md specification as the source. You can extend or port existing token specs to new projects and tooling while maintaining structural validation and consistency.