design-system
Generate a design system from an existing codebase or audit one for visual consistency: extract tokens (colors, typography, spacing, shadows) into design-tokens.json and CSS custom properties with DESIGN.md rationale and an interactive HTML preview, score the UI across 10 dimensions, and flag AI-slop patterns. Use when starting a design system, auditing visual consistency before a redesign, or reviewing a PR that touches styling.
Target: Design & content creation. Automatically collected · unverified.
Excerpt from the author’s documentation
Extracted from a fixed version of SKILL.md in its original language. This is the author’s documentation; installation, compatibility and runtime results have not been verified by this site.
Read the original English text
Topics in the source
- Design System — Generate & Audit Visual Systems
- When to Use
- How It Works
- Mode 1: Generate Design System
- Mode 2: Visual Audit
- Mode 3: AI Slop Detection
- Examples
Starting a new project that needs a design system Auditing an existing codebase for visual consistency Before a redesign — understand what you have When the UI looks "off" but you can't pinpoint why Reviewing PRs that touch styling Analyzes your codebase and generates a cohesive design system: Output: DESIGN.md + design-tokens.json + design-preview.html Scores your UI across 10 dimensions (0-10 each): Each dimension gets a score, specific examples, and a fix with exact file:line. Identifies generic AI-generated design patterns: Generate for a SaaS app: Audit existing UI: Check for AI slop:
- Source repository
- affaan-m/ECC
- Source file
- pi/core/skills/design-system/SKILL.md
- Fixed revision
- d2ef2680594f9a17526a6e1a2e18b3d242c5d17b
Sources and evidence
This record was collected automatically. Its documentation, suitability and runtime behavior have not been manually verified.
Author: affaan-m/ECC · original repository metadata. Documentation review: Not reviewed. Last source check: 2026-11-09T15:01:42.950Z.
Categories are inferred from names, descriptions and paths. They do not establish compatibility.
License and attribution
MIT. Third-party content and copyright remain with their authors. Refer to the original license and terms.
Original license ↗Synchronization, copying and user-reported success do not mark a resource as runtime-tested.
Limitations and notes
- Collecting metadata does not mean this site has installed, adapted, runtime-tested or security-reviewed the resource.