skills.rest
14790897
14790897COMMUNITY
Explore all skills by this author →
Website𝕏@hahfrankGitHub

kwp-design-design-system

Audit component libraries for naming inconsistencies and missing documentation.

7|5|Updated May 7, 2026
Search Tags:#documentation#accessibility#design system#component library#design tokens#ui audit
One-click install
npx skills add https://github.com/14790897/MiQi --skill kwp-design-design-system
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: kwp-design-design-system
Source: https://github.com/14790897/MiQi/tree/main/miqi/skills/kwp/design/design-system
Command: npx skills add https://github.com/14790897/MiQi --skill kwp-design-design-system

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill addresses the fragmentation and inconsistency in UI design systems by providing a structured way to audit existing components, document variants, and define new patterns.

Core Features & Use Cases

  • System Audit: Automatically identify naming inconsistencies, hardcoded values, and missing documentation across your component library.
  • Component Documentation: Generate standardized documentation for component variants, states, and accessibility requirements.
  • Pattern Extension: Propose and define new design patterns that align with existing token and component constraints.

Quick Start

Use the design-system skill to perform a full audit of the current component library.

Frequently Asked Questions about kwp-design-design-system

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

FAQPage Schema
How do I audit a design system component library for consistency?▼

To audit a design system, you can automatically identify naming inconsistencies, hardcoded values, and missing documentation across your component library to ensure UI consistency.

What is a design token and how do I document it across product development?▼

A design token is a named variable for visual properties. You can document tokens and accessibility specifications to standardize UI pattern management across the product lifecycle.

How do I generate standardized documentation for component variants and states?▼

You can generate standardized documentation for component variants, states, and accessibility requirements by auditing your UI patterns and validating visual specifications and naming conventions.

Does this design system audit tool require integration with design tools?▼

Yes, validating visual specifications and naming conventions requires integration with design tools or documentation repositories to manage design tokens and component variants effectively.

How do I define new design patterns that align with existing component constraints?▼

You can propose and define new design patterns that align with existing token and component constraints by extending the documented system to prevent UI fragmentation.

Why does my UI design system have fragmentation and inconsistent component variants?▼

Fragmentation occurs from missing documentation and hardcoded values. Performing a full system audit identifies these inconsistencies to help standardize your component variants.

Related Skills

Explore More Design & Creative Skills→
tankpkgtankpkg
1

@tank/figma-to-code

Translate Figma designs into CSS and component structures.

Official
Advanced
efekrbasefekrbas
41

tailwind-design-system

Design Tailwind CSS design systems with semantic tokens and accessible variants.

Community
Advanced
OlympusLaboratoriesOlympusLaboratories

Document — Update Project Documentation

Audit and synchronize README.md and AGENTS.md with the current codebase.

Official
Intermediate
FoundationForgeFoundationForge

design-system

Audit design systems for naming inconsistencies, hardcoded values, and accessibility gaps.

Official
Intermediate