design-md-validatorValidate, diff, and export DESIGN.md files to ensure consistent design tokens, WCAG compliance, and design system integrity across projects.
Install via ClawdBot CLI:
clawdbot install flexrox/design-md-validatorGrade Limited — based on market validation, documentation quality, package completeness, maintenance status, and authenticity signals.
Calls external URL not in known-safe list
https://github.com/google-labs-code/design.mdAudited Apr 24, 2026 · audit v1.0
Generated May 1, 2026
A frontend team uses DESIGN.md to ensure all UI components adhere to the design system before merging code. The lint command validates WCAG contrast ratios and token references, catching issues early.
When updating a design system, a team uses diff to compare old and new DESIGN.md files, detecting token additions, removals, and modifications. This helps identify regressions before deployment.
A developer exports design tokens from DESIGN.md to a Tailwind theme file, enabling direct use of design system values in utility-first CSS without manual mapping.
New designers read the project's DESIGN.md to understand the existing visual identity, then run lint to validate any proposed changes against the system's rules.
In a CI pipeline, the lint command checks DESIGN.md on each pull request, preventing broken tokens or inaccessible color combinations from entering production.
Offer the DESIGN.md validator as a free CLI tool, with premium features like advanced diff reports or integration with project management tools for a subscription fee.
Provide consulting to help organizations adopt DESIGN.md, including training, custom export templates, and workflow integration, charging per engagement.
Offer automated audits of existing design systems using the lint and diff commands, providing a detailed report of issues and recommendations, sold as a one-time service.
💬 Integration Tip
Integrate the lint and diff commands into your CI/CD pipeline to automate design validation on every pull request.
Scored May 1, 2026
Implements UI from design mockups (Figma, Sketch, or image) with pixel-accurate layout, responsive behavior, and design tokens. Use when 还原设计图, implementing...
Senior product designer methodology ensuring thorough user research, structured architecture, accessible color and typography systems, and pixel-perfect UI e...
Complete Motion.dev documentation - modern animation library for React, JavaScript, and Vue (formerly Framer Motion)
Translate Figma nodes into production-ready code with 1:1 visual fidelity using the Figma MCP workflow (design context, screenshots, assets, and project-conv...
Shared design system for yuanfang-skills. Provides token CSS variables, 12+ themes, and reusable layout-type HTML blocks. Used by yuanfang-html-image (and fu...
Use when building, reviewing, or improving frontend UI that needs product-specific design direction, design-system generation, Master/Page overrides, distinc...