refactor-ui

Analyze UI designs against Refactoring UI principles and generate prioritized JSON reports.

240|11|Updated Apr 26, 2026

Search Tags:#typography #accessibility #design-review #color-contrast #visual-hierarchy #ui-audit #prioritized-fixes

Ready to run

npx skills add https://github.com/gnurio/refactoring-ui-plugin --skill refactor-ui

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: refactor-ui
Source: https://github.com/gnurio/refactoring-ui-plugin/tree/main/skills/meta-refactor-ui
Command: npx skills add https://github.com/gnurio/refactoring-ui-plugin --skill refactor-ui

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps you identify UI design issues across multiple Refactoring UI principles and turn them into a prioritized set of actionable improvements.

Core Features & Use Cases

Comprehensive multi-skill assessment: Reviews a design against visual hierarchy, typography scale, color palette, spacing rhythm, button hierarchy, visual clutter, empty states, shadows, color contrast, and grouping.
Prioritized, severity-based recommendations: Consolidates findings, deduplicates repeated issues, and ranks fixes by impact.
Mode-driven outputs: Produces quick PASS/FAIL-only results, full PASS-with-rationale deep analysis, or fix-ready instructions with before/after examples.

Quick Start

Run the refactor-ui orchestrator with your design description so it returns an overall score and a prioritized list of specific fixes.

Frequently Asked Questions about refactor-ui

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

FAQPage Schema

How do I audit a UI design for visual hierarchy and typography issues?▼

To audit a UI design for visual hierarchy and typography issues, you can analyze text descriptions and optional screenshots against Refactoring UI principles to generate a consolidated assessment with prioritized fixes.

What is the best way to prioritize UI design fixes for accessibility and color contrast?▼

The best way to prioritize UI design fixes for accessibility and color contrast is to aggregate violations by severity, deduplicate overlapping issues, and generate a ranked list of prioritized recommendations.

Can I review dashboards and marketing pages for spacing rhythm and visual clutter?▼

Yes, you can review dashboards and marketing pages for spacing rhythm and visual clutter by applying multi-skill UI audit principles to text descriptions and screenshots to identify specific design improvements.

Does the UI audit generate actionable before and after examples for button hierarchy?▼

Yes, the UI audit generates actionable before and after examples for button hierarchy by operating in a fix-ready mode that outputs instructions alongside a structured JSON report including an overall score and prioritized fixes.

How do I get a quick PASS or FAIL assessment for empty states and color palette?▼

To get a quick PASS or FAIL assessment for empty states and color palette, you can run a mode-driven UI audit that produces quick results evaluating specific Refactoring UI principles without deep rationale.