design-md

Create, lint, and export Google DESIGN.md token spec files.

Updated Apr 29, 2026
One-click install
npx skills add https://github.com/DifanaDAP/hermes-backup --skill design-md-difanadap
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: design-md
Source: https://github.com/DifanaDAP/hermes-backup/tree/main/workspace/skills/creative/design-md
Command: npx skills add https://github.com/DifanaDAP/hermes-backup --skill design-md-difanadap

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve?

This Skill streamlines the creation, validation, and export of Google's DESIGN.md token spec files, simplifying the design and branding process.

Core Features & Use Cases

  • Design Spec Creation: Build a design system specification file for branding consistency across projects.
  • Token Validation: Lint structure and token references to ensure spec accuracy.
  • Export Options: Generate exports for Tailwind CSS or W3C DTCG JSON for further development.
  • Use Case: If you need a consistent UI/brand across multiple projects or want to validate a color palette for WCAG accessibility, this skill can help you achieve that.

Quick Start

Create a new DESIGN.md file for your brand using the 'design-md' skill.

Frequently Asked Questions about design-md

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

FAQPage Schema
How do I create and validate a DESIGN.md token spec file?

To create and validate a DESIGN.md token spec, use this Skill to automate building the file, linting its structure, and checking token references for accuracy. It ensures your design system specification remains correctly formatted and structurally sound.

Can I export DESIGN.md tokens to Tailwind CSS or W3C DTCG JSON?

Yes, you can export DESIGN.md tokens to Tailwind CSS or W3C DTCG JSON. This Skill automates formatting and generating these export files, allowing direct integration of your validated design tokens into downstream development environments.

How do I validate WCAG color contrast in a design system spec?

You can validate WCAG color contrast by running your design system spec through this Skill's linting process. It checks your color palette against WCAG accessibility standards to ensure your UI tokens meet compliance requirements.

Do I need Python to lint and export Google's DESIGN.md token files?

Yes, you need Python installed with specific packages to use this Skill. The Python environment handles the parsing and formatting required to lint structure, validate WCAG contrast, and generate Tailwind or W3C DTCG JSON exports.

What is the best way to maintain UI token consistency across multiple projects?

The best way to maintain UI consistency is to use a centralized DESIGN.md token spec file. This Skill streamlines creating and validating that single source of truth, which can then be exported for branding consistency across multiple projects.