skills.rest
jordanhubbard
jordanhubbardCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

design-md

Validate, diff, and export Google DESIGN.md files to Tailwind or W3C DTCG JSON.

9|3|Updated May 18, 2026
Search Tags:#design#branding#accessibility#specification#tokens
One-click install
npx skills add https://github.com/jordanhubbard/mac --skill design-md-jordanhubbard
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-md
Source: https://github.com/jordanhubbard/mac/tree/main/src/mac/_hermes/skills/creative/design-md
Command: npx skills add https://github.com/jordanhubbard/mac --skill design-md-jordanhubbard

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires @google/design.md, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill simplifies the process of authoring, validating, and exporting Google's DESIGN.md token spec files, making it easier to manage and maintain visual identity across projects.

Core Features & Use Cases

  • Authoring: Create and maintain DESIGN.md files with structured front matter and Markdown body.
  • Validation: Check for structural integrity, token references, and WCAG contrast compliance.
  • Exporting: Convert DESIGN.md files to Tailwind CSS or W3C DTCG JSON formats.
  • Use Case: When you need to create a consistent UI/brand across multiple projects or ensure your color palette meets accessibility standards.

Quick Start

Run the design-md skill to validate and export your DESIGN.md file 'brand-guide.md'.

Frequently Asked Questions about design-md

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

FAQPage Schema
How do I validate DESIGN.md token spec files for WCAG contrast compliance?▼

You can validate DESIGN.md files by running the design-md CLI, which checks structural integrity, token references, and WCAG contrast compliance to ensure your visual identity meets accessibility standards.

Can I export DESIGN.md tokens to Tailwind CSS and W3C DTCG JSON formats?▼

Yes, you can export DESIGN.md files directly to Tailwind CSS or W3C DTCG JSON formats using the design-md CLI, converting your visual identity tokens for integration into styling frameworks.

Do I need Node.js and npm to use the design-md CLI for token validation?▼

Yes, Node.js and npm are required dependencies to execute design-md CLI commands, which handle the validation, diffing, and exporting of your DESIGN.md token specification files.

What is the best way to maintain consistent UI branding across multiple projects using design tokens?▼

Authoring and validating DESIGN.md files provides a structured Markdown specification for visual identities, ensuring consistent UI branding and color palettes across multiple projects and coding agents.

How do I diff DESIGN.md files to track changes in visual identity specifications?▼

The design-md CLI diffs DESIGN.md files by comparing their structured front matter and Markdown body, allowing you to track modifications in token references and visual identity specifications.

Related Skills

Explore More Design & Creative Skills→
lenadlmlenadlm

design-md

Validate and export Google DESIGN.md files to Tailwind CSS or W3C DTCG JSON.

Community
Advanced
liumeixinliumeixin
4

design-md

Generate, validate, and export DESIGN.md files to Tailwind CSS and W3C DTCG JSON.

Community
Advanced
seo-jinseokseo-jinseok

moai-domain-uiux

Guide UI/UX design systems with W3C DTCG 2025.10 tokens and WCAG 2.2 compliance.

Community
Advanced
LamseyahEliasLamseyahElias

design-md

Author, validate, and export DESIGN.md tokens to Tailwind or DTCG JSON.

Community
Intermediate