skills.rest
sjmontano
sjmontanoCOMMUNITY
Explore all skills by this author →
GitHub

google-design-md

Create, validate, and export DESIGN.md files with design tokens.

Updated May 29, 2026
Search Tags:#tailwind#lint#design-system#export#design-tokens#design-md#dtcg
One-click install
npx skills add https://github.com/sjmontano/SafeRoutes-Popayan --skill google-design-md-sjmontano
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: google-design-md
Source: https://github.com/sjmontano/SafeRoutes-Popayan/tree/main/.agents/skills/google-design-md
Command: npx skills add https://github.com/sjmontano/SafeRoutes-Popayan --skill google-design-md-sjmontano

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Design teams often struggle to keep design tokens consistent across projects and platforms, leading to misaligned visuals and inefficient handoffs.

Core Features & Use Cases

  • Create, validate, and export DESIGN.md files containing machine-readable design tokens.
  • Lint and enforce token consistency across design systems.
  • Use across projects to generate Tailwind themes or DTCG-compatible tokens for AI agents.

Quick Start

Generate a DESIGN.md for your project with tokens, rationale, and a lint checklist.

Frequently Asked Questions about google-design-md

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

FAQPage Schema
How do I lint design tokens to keep them consistent across projects?▼

You can lint design tokens for consistency by validating them within a DESIGN.md file, ensuring your design system remains aligned and structurally correct across different projects.

Can I export design tokens for Tailwind themes and DTCG formats?▼

Yes, you can export design tokens from DESIGN.md files directly into Tailwind themes or DTCG-compatible tokens, making them portable for AI-assisted workflows and style frameworks.

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

A DESIGN.md file is a machine-readable document containing color, typography, and spacing tokens with YAML frontmatter. You need it to manage and maintain token consistency across platforms.

How do I create a DESIGN.md file with color, typography, and spacing tokens?▼

You can generate a DESIGN.md file by defining your color, typography, and spacing tokens alongside YAML frontmatter, which includes version, name, and description metadata for your design system.

Does this design token approach work with AI-assisted workflows?▼

Yes, this approach supports AI-assisted workflows by providing DTCG-compatible tokens that AI agents can read, ensuring consistent design application and automated theme generation.

Related Skills

Explore More Design & Creative Skills→
soeiroosoeiroo

design-token

Define and organize design tokens for consistent theming across products.

Community
Advanced
matthew-johnsonmatthew-johnson

design-md

Validate DESIGN.md token files for type correctness and export readiness.

Community
Intermediate
zengbaochengzengbaocheng

design-md

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

Community
Intermediate
htayjhtayj

add-rest-endpoint

Automate REST API endpoint creation with schema design, routing, handlers, tests, and documentation.

Community
Intermediate