skills.rest
henrique-simoes
henrique-simoesCOMMUNITY
Explore all skills by this author →
GitHub

design-system-audit

Processes design artifacts and component files to verify conformance and accessibility.

13|4|Updated Mar 14, 2026
Search Tags:#consistency#accessibility#audit#tokens#design-system#ui-components
One-click install
npx skills add https://github.com/henrique-simoes/Istara --skill design-system-audit-henrique-simoes
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-system-audit
Source: https://github.com/henrique-simoes/Istara/tree/main/skills/deliver/design-system-audit
Command: npx skills add https://github.com/henrique-simoes/Istara --skill design-system-audit-henrique-simoes

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Evaluate consistency against design system, identify deviations, accessibility compliance.

Core Features & Use Cases

  • Design-system conformance checks: compare UI components to design tokens, typography, spacing, and color usage.
  • Deviation detection & reporting: surface inconsistencies with evidence-backed findings.
  • Accessibility validation: automated checks for color contrast, keyboard navigation, and ARIA attributes.
  • Use Case: QA during design reviews, when onboarding new components, and for governance across multi-brand products.

Quick Start

Inspect your latest UI components and run an automated audit against the design system to surface deviations and accessibility gaps.

Frequently Asked Questions about design-system-audit

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

FAQPage Schema
How do I run a design system audit to check UI component conformance?▼

Run a design system audit by processing design artifacts and component files to verify conformance against design tokens, typography, spacing, and color usage. The audit outputs evidence-backed findings with priority recommendations for UI consistency.

What is design system governance and when do I need accessibility validation?▼

Design system governance maintains UI consistency across multi-brand products, requiring accessibility validation during design reviews, component onboarding, and multi-platform releases to verify color contrast, keyboard navigation, and ARIA attributes compliance.

Can I use this design audit process for iOS and Android projects?▼

Yes, this design audit process applies to UI component governance and new component integrations across web, iOS, and Android projects, verifying design token usage and accessibility compliance consistently across all platforms.

What's the best way to detect design token deviations in UI components?▼

Detect design token deviations by processing component files through an automated audit that surfaces inconsistencies with evidence-backed findings. This compares UI elements directly against established color, typography, and spacing tokens to identify priority fixes.

How do I validate ARIA attributes and color contrast during a UI component review?▼

Validate ARIA attributes and color contrast by running automated accessibility checks during your UI component review. The audit processes design artifacts to identify compliance gaps and outputs evidence-backed findings with priority recommendations for remediation.

Related Skills

Explore More Design & Creative Skills→
jac007xjac007x

design-system-validator

Audit Walmart design-system compliance across tokens, components, and spacing.

Community
Advanced
mazicimertmazicimert

ui-review

Review SwiftUI code for UI deviations and accessibility gaps against Apple Human Interface Guidelines.

Community
Intermediate
DevXojeDevXoje

ui-components

Standardize UI component creation with atomic design and TypeScript guidelines.

Community
Basic
CrazyDubyaCrazyDubya

accessibility-auditor

Audit web applications for WCAG 2.1 Level AA accessibility compliance.

Community
Intermediate