Diagnose and fix visual defects in UI components using rule-based corrections.
npx skills add https://github.com/prapanch/agent-forma --skill refactoring-ui-prapanch
Please help me install this Agent Skill. Skill: refactoring-ui Source: https://github.com/prapanch/agent-forma/tree/main/refactoring-ui Command: npx skills add https://github.com/prapanch/agent-forma --skill refactoring-ui-prapanch
Visual designers and frontend engineers often struggle to diagnose why UI looks off. This skill captures the most common visual failure modes and provides explicit fixes to improve readability, hierarchy, spacing, and polish.
Apply the 10 visual correction rules to diagnose and fix spacing, hierarchy, borders, color saturation, typography, inputs, modals, and mobile layout in a UI component.
High-intent search queries and answers about installing and using this skill.
Fix visual UI issues by applying rule-based corrections for spacing, typographic hierarchy, borders, shadows, and color saturation to improve readability and polish in frontend components. This skill diagnoses common visual defects and provides explicit fixes for each failure mode.
Diagnose why a UI looks off by evaluating it against ten visual correction rules covering empty states, typography weight, and mobile responsiveness. This rule-based approach identifies common failure modes in card grids, form layouts, and component libraries.
Yes, you can audit design systems to ensure a consistent design language by checking color saturation, interactive inputs, modals, and overlays. The skill provides explicit rules to correct visual inconsistencies across component libraries.
Yes, this UI refactoring approach covers mobile responsiveness and motion with accessibility considerations as part of its ten visual correction rules. It ensures that responsive layouts and interactions remain accessible while improving visual polish.
Use borders or shadows to improve visual hierarchy based on the specific rule-based corrections this approach applies to your UI components. The skill diagnoses which styling method best resolves visual defects and enhances readability.
Kael-DeanAssess and enhance UI layout spacing, rhythm, and visual hierarchy.
shobhitsrivastava2023Automate design and implementation of production-grade frontend interfaces.
geoffreywooIdentify and fix visual design flaws across sites and component libraries.
JansenAnalyticsAnalyze frontend screenshots to detect visual defects and generate structured reports.
