skills.rest
zaiyemeiyou404
zaiyemeiyou404COMMUNITY
Explore all skills by this author →
GitHub

design-md

Create, validate, and export Google's DESIGN.md token spec files.

Updated May 25, 2026
Search Tags:#design#branding#specification#tokens#exporting
One-click install
npx skills add https://github.com/zaiyemeiyou404/Hermes --skill design-md-zaiyemeiyou404
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-md
Source: https://github.com/zaiyemeiyou404/Hermes/tree/main/backup/skills/creative/design-md
Command: npx skills add https://github.com/zaiyemeiyou404/Hermes --skill design-md-zaiyemeiyou404

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 creating, validating, and exporting Google's DESIGN.md token spec files, streamlining the design system development process.

Core Features & Use Cases

  • DESIGN.md Creation: Generate and update DESIGN.md files to describe visual identities for coding agents.
  • Token Validation: Lint and check for errors in token structure and WCAG contrast compliance.
  • Token Exporting: Export tokens to Tailwind CSS or W3C DTCG JSON formats for use in different environments.
  • Use Case: Create a consistent UI/brand across multiple projects or tools by managing your design tokens through this skill.

Quick Start

Generate a new DESIGN.md for your brand by providing the brand tone and accent color.

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 tokens for WCAG contrast and structure errors?▼

You can validate design tokens for WCAG contrast and structure errors by linting your DESIGN.md token spec files, which checks for structural integrity and accessibility compliance before exporting.

How do I export design tokens to Tailwind CSS or DTCG JSON?▼

Exporting design tokens to Tailwind CSS or W3C DTCG JSON formats is done by processing your DESIGN.md file, converting the visual identity specifications into the desired environment configuration output.

What is a DESIGN.md token spec file used for?▼

A DESIGN.md token spec file is used to describe visual identities and UI branding for coding agents, ensuring a consistent design system across multiple projects or development tools.

Do I need Node.js and the @google/design.md CLI to create and manage design tokens?▼

Yes, creating, validating, and exporting DESIGN.md token specifications requires Node.js and the @google/design.md CLI to run the necessary scripts for design system development.

Can I automate UI branding specification creation for multiple projects?▼

Automating UI branding specification creation for multiple projects is possible by generating and updating DESIGN.md files with your brand tone and accent color to maintain visual consistency.

Related Skills

Explore More Design & Creative Skills→
zangjeicyzangjeicy

design-md

Lint and export Google DESIGN.md design tokens to Tailwind theme JSON.

Community
Intermediate
aivos-xieaivos-xie
1

design-md

Generate and validate Google DESIGN.md design tokens with WCAG accessibility checks.

Community
Intermediate
SignmanalSignmanal
1

design-md

Author, validate, and export DESIGN.md design token files to Tailwind or W3C DTCG JSON.

Community
Intermediate
hungv47hungv47
14

brief-product-ui

Convert a validated map-user-flow into a portable UI specification with design tokens.

Community
Advanced