design-system-extraction-cowork

Community

Comprehensive visual audit and UI pattern cataloging tool.

AuthorAndrejKiri
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill facilitates visual auditing of web application UIs, enabling teams to systematically identify inconsistencies, document UI patterns, and prepare handoff assets for development and design teams.

Core Features & Use Cases

  • Interactive UI Browsing: Navigates through all scoped pages, capturing layout and style observations.
  • Pattern Cataloging: Enumerates and classifies recurring UI components and patterns across pages.
  • Inconsistency Detection: Highlights stylistic and implementation variances for correction before release.
  • Use Case: A developer auditing a new product dashboard can document standard components, detect deviations, and generate comprehensive reports for consistent UI implementation.

Quick Start

Run this skill after authenticating to your application, then browse pages to generate audit data for engineering review.

Dependency Matrix

Required Modules

playwrightnode

Components

scriptsreferencesassets

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: design-system-extraction-cowork
Download link: https://github.com/AndrejKiri/prometheus-design-system/archive/main.zip#design-system-extraction-cowork

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.