dux-design-md-lint

Validate DESIGN.md against getdesign.md v2 schema and WCAG 2.1 AA contrast.

1|Updated May 20, 2026
One-click install
npx skills add https://github.com/Yash-1511/bmad-dux-visual-architect --skill dux-design-md-lint
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: dux-design-md-lint
Source: https://github.com/Yash-1511/bmad-dux-visual-architect/tree/main/skills/dux-design-md-lint
Command: npx skills add https://github.com/Yash-1511/bmad-dux-visual-architect --skill dux-design-md-lint

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve?

This Skill finds schema issues and accessibility contrast problems inside your project’s single source of design truth, DESIGN.md.

Core Features & Use Cases

  • DESIGN.md schema validation: Checks the getdesign.md v2 9-section structure and enforces canonical prose section ordering.
  • Coverage enforcement (YAML ↔ prose): Ensures every declared component exists in the Components prose and vice versa.
  • Token reference validation: Flags broken {group.name} token references in DESIGN.md prose.
  • WCAG contrast auditing: Computes WCAG 2.1 AA contrast for the relevant color/token pairings and produces an offline, self-contained HTML report.
  • Edge-case severity interpretation: Adjusts severity for disabled/placeholder conventions, decorative hairline usage, and explicit relaxations recorded by dux-design-md (without writing back).

Quick Start

Tell the system: lint DESIGN.md to generate an offline HTML report showing any errors, warnings, and suggested fixes.

Frequently Asked Questions about dux-design-md-lint

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

FAQPage Schema
How do I check WCAG 2.1 AA contrast ratios in a design system markdown file?

You can check WCAG 2.1 AA contrast by linting DESIGN.md to compute contrast ratios for required color pairs, generating an offline HTML report with errors, warnings, and suggested fixes.

How do I validate token references in DESIGN.md?

Token reference validation flags broken {group.name} references in DESIGN.md prose, ensuring all design tokens resolve correctly during design system authoring and review workflows.

Can I use a design system linter in CI pipelines for automated accessibility checks?

Yes, the linter provides a CI-friendly headless contract with deterministic JSON findings emission and non-zero exit codes on error-severity findings, enabling automated accessibility checks.

What is YAML to prose coverage enforcement in design system documentation?

Coverage enforcement ensures every declared component in YAML exists in the Components prose section and vice versa, maintaining consistency between structured data and documentation.

How do I generate an offline accessibility report for design system color pairs?

Lint DESIGN.md to produce a self-contained offline HTML report that renders all WCAG contrast audit findings, including suggested fixes for required color and token pairings.

Does the design system linter handle edge cases like decorative hairlines or disabled states?

Yes, the linter adjusts severity for disabled and placeholder conventions, decorative hairline usage, and explicit relaxations recorded in DESIGN.md without writing changes back.