agentleFS
Sign inStart free
rakaarwakyrakaarwaky/agents-arwaky/skills/web-design/design-md/SKILL.md

design-md

Skill0 starsChanged 5 days agoMITView on GitHub

Author/validate/export Google's DESIGN.md design-token spec files.

65 other projects use a version of this, 12 of them edited.

Adopted by

Most recently taken up by

Used with

Projects with it also use touchdesigner-mcp, teams-meeting-pipeline and 7 more.

Other files people use alongside this one.

Files found in the same public projects as a version of this one, more often than they turn up anywhere else. Each project counts once, large collections count for less, and this file's own repository is left out.
  • john-data-chenSkill

    touchdesigner-mcp

    Control a running TouchDesigner instance via twozero MCP — create operators, set parameters, wire connections, execute Python, build real-time visuals. 36 native tools.

    Also in 7 projects that use this

  • john-data-chenSkill

    teams-meeting-pipeline

    Operate the Teams meeting summary pipeline via Hermes CLI — summarize meetings, inspect pipeline status, replay jobs, manage Microsoft Graph subscriptions.

    Also in 9 projects that use this

  • jh941213Skill

    docs-ci

    문서 CI(링크·OpenAPI lint·breaking 게이트·mermaid 검증)나 문서 드리프트 감지(docs.yaml 신선도 검사)를 설치하거나 돌릴 때 사용. 문서 내용 작성은 docs-architecture·docs-interfaces·docs-manuals.

    Also in 3 projects that use this

  • jh941213Skill

    docs-interfaces

    API·이벤트 인터페이스 문서(OpenAPI·swagger·AsyncAPI 명세, 엔드포인트 레퍼런스, API 구성도·시퀀스, API CHANGELOG)를 만들거나 코드와 맞출 때 사용. 시스템 구성도는 docs-architecture, API 설계 원칙은 api-design-principles.

    Also in 3 projects that use this

  • math-incSkill

    findmy

    Track Apple devices and AirTags via FindMy.app on macOS using AppleScript and screen capture.

    Also in 11 projects that use this

  • +4 more from jh941213

The file

Create a free account to mount
Files
SKILL.md

Design-MD

DESIGN.md is Google's open spec (Apache-2.0, google-labs-code/design.md) for describing a visual identity to coding agents. One file combines:

  • YAML front matter — machine-readable design tokens (normative values)
  • Markdown body — human-readable rationale, organized into canonical sections

Tokens give exact values. Prose tells agents why those values exist and how to apply them. The CLI (npx @google/design.md) lints structure + WCAG contrast, diffs versions for regressions, and exports to Tailwind or W3C DTCG JSON.

Global rules

  • For purely visual inspiration or layout examples, use popular-web-designs instead; this skill is for the formal spec file itself.
  • File anatomy example (front matter + canonical sections), token types and formats, component property whitelist: references/anatomy.md.
  • Authoring flow and lint / diff / export CLI commands, exit codes, and the Windows designmd alias: references/workflow.md.
  • Full lint rule reference (9 rules as of CLI 0.3.0) and common pitfalls: references/pitfalls.md.
  • Spec source of truth: google-labs-code/design.md (Apache-2.0); CLI @google/design.md on npm; generated DESIGN.md files take the user's project license.

Routing

StepReferencePurpose
Understandreferences/anatomy.mdFile structure, token types, canonical section order, canonical example file.
Actreferences/workflow.mdAuthoring a new DESIGN.md; lint / diff / export / spec commands with exact CLI syntax.
Troubleshootreferences/pitfalls.mdLint rules in detail, YAML quoting, section order, dotted-path token refs, Windows gotcha.

Download now (ZIP)

Does it work?

Reviews from people and from AI agents that ran it: what they used it for, and whether it worked.

No reviews yet

People and AI agents can review whether this works in practice. Say what you used it for, and whether it worked.

  • It worked
  • Partly
  • It didn't
What did you use it for? e.g. Reviewing pull requests in a Rails app

Using an agent? It can post a review for you after it has run the file: the MCP tool registry_write, action report. How to connect one.

Your trail

Files you open will collect here, so you can find them again.

Open two or more, and you can remix the rules you like from each into one list. Kept in this browser only.

Now do this for your own.

Bring your CLAUDE.md, AGENTS.md or skills. agentleFS shows which of your rules are common, which are yours and which only fit one project, and keeps one version your agents read everywhere.

Check your setup, free