reviewing-design-system

Reviews finished design-system documents against a usability, consistency, and accessibility checklist and emits an approve or revise verdict.

Updated Sep 5, 2026
One-click install
npx skills add https://github.com/pohlai88/afenda-xforge-v5 --skill reviewing-design-system-pohlai88
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: reviewing-design-system
Source: https://github.com/pohlai88/afenda-xforge-v5/tree/main/.agents/skills/reviewing-design-system
Command: npx skills add https://github.com/pohlai88/afenda-xforge-v5 --skill reviewing-design-system-pohlai88

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Deciding whether a finished design-system document is good enough to build from is subjective and error-prone. This Skill acts as an acceptance gate: it judges a design-system document (or a versioned amend delta) against a fixed, single-sourced bar covering DTCG design tokens, component completeness, catalog coverage, WCAG 2.2 AA accessibility, internationalization, and governance, then emits a machine-parseable verdict with actionable findings. ## Core Features & Use Cases - Checklist-based review: Judges 13 named conditions — principles, DTCG intent-named tokens, foundations, theming, per-component five-part specs, API consistency, catalog coverage, patterns, layout/i18n, numeric WCAG 2.2 AA accessibility, voice, governance, and groundedness. - Delta-scoped amend review: For versioned changes, reviews only the diff — checking scope-confinement, token ripple/regression, semver accuracy, and deprecation safety. - Machine-parseable output: Emits exactly VERDICT: approve or VERDICT: revise plus actionable findings (failed condition, location, concrete fix). - Use Case: Before wireframing begins, run this Skill on a finished design-system markdown document to confirm an engineer can build a consistent, accessible UI from it — catching issues like a Button spec hard-coding #1A73E8 instead of referencing a semantic token. ## Quick Start Review the attached design-system document against the buildability bar and give me the verdict with any blocking findings.

Frequently Asked Questions about reviewing-design-system

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

FAQPage Schema
How do I review a design system document before building UI from it?

Run this Skill on the finished markdown document. It judges 13 conditions — DTCG tokens, component completeness, catalog coverage, numeric WCAG 2.2 AA accessibility, i18n, and governance — then emits VERDICT: approve or VERDICT: revise with actionable findings.

How to review a design system amend or versioned delta?

Provide the delta plus the prior version. The Skill switches to delta-scoped review: it checks scope-confinement, orphaned token references, semver bump accuracy, changelog match, and deprecation safety without re-litigating untouched parts.

What accessibility standard does design system review check against?

It requires numeric WCAG 2.2 AA thresholds: text contrast 4.5:1, visible and not-obscured focus (SC 2.4.7/2.4.11), a 2px/3:1 focus-appearance house rule (SC 2.4.13), 24x24 target size, keyboard support, and reduced motion.

When should I not use this design system review skill?

Do not use it to author or repair a design system, review per-screen wireframes or user flows, evaluate engineering design docs, or grade a coded component library. It only judges the textual design-system document as an acceptance gate.

Why did a small design system get approved despite missing sections?

The bar is proportional to product archetype. Thin products legitimately collapse conditions like governance, i18n, or iconography; only the catalog hard floor, DTCG tokens, and numeric accessibility apply at every size.