design-md

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

2|Updated Jun 8, 2026
One-click install
npx skills add https://github.com/vikrant-project/devil-agent-ai-platform --skill design-md-vikrant-project
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: design-md
Source: https://github.com/vikrant-project/devil-agent-ai-platform/tree/main/agent_core/skills/creative/design-md
Command: npx skills add https://github.com/vikrant-project/devil-agent-ai-platform --skill design-md-vikrant-project

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill automates the creation, validation, and export of Google's DESIGN.md token spec files, streamlining the process of designing and managing UI components across multiple projects.

Core Features & Use Cases

  • Authoring: Create and manage design tokens in a structured YAML format.
  • Validation: Check for structure, token references, and WCAG contrast compliance.
  • Exporting: Generate Tailwind CSS and W3C DTCG JSON formats from the design tokens.
  • Use Case: For a team working on a UI project, this Skill can help maintain consistency across components and ensure accessibility standards are met.

Quick Start

Use the design-md skill to create a new DESIGN.md file for your project by running the command: 'design-md create MyBrand'.

Frequently Asked Questions about design-md

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

FAQPage Schema
How do I automate DESIGN.md token spec file creation for my UI project?

You can automate DESIGN.md token spec file authoring by running the create command to generate a structured YAML format for your UI project. This initializes your design tokens and prepares them for validation and exporting.

Can I validate design tokens for WCAG contrast compliance automatically?

Yes, you can validate design tokens for WCAG contrast compliance automatically. The validation feature checks your token structure, token references, and accessibility standards to ensure your UI components meet requirements.

How do I export design tokens to Tailwind CSS and W3C DTCG JSON formats?

You can export design tokens to Tailwind CSS and W3C DTCG JSON formats using the export feature. This generates the required format files directly from your structured YAML design tokens for immediate use.

Do I need prior knowledge of the DESIGN.md spec and YAML formatting to use this workflow?

Yes, you need prior knowledge of the DESIGN.md spec and YAML formatting. This prerequisite is required because the authoring, validation, and exporting processes rely heavily on structured YAML inputs.

What is the best way to lint and diff design tokens across multiple projects?

The best way to lint and diff design tokens across multiple projects is by using automated validation commands. This checks your structure and token references to maintain consistency across your UI components.

Why does my design token validation fail when checking token references?

Design token validation fails when checking token references if your YAML structure contains broken links or invalid references. The linting process identifies these structural errors to prevent exporting incorrect tokens.