Transforms screenshot-based UI/UX feedback into systematic code implementations and visual style fixes.
This skill empowers Claude to bridge the gap between visual design and implementation by processing image-based feedback. It follows a rigorous five-phase methodology—analysis, investigation, root cause identification, implementation, and verification—to ensure that UI bugs aren't just patched, but resolved systematically. Whether dealing with 'hot mess' layouts, inconsistent button styles, or responsive design failures, this skill enables Claude to identify the styling system (Tailwind, CSS Modules, etc.), locate relevant components, and apply consistent fixes across the entire codebase.
Características Principales
012,674 GitHub stars
02Root cause analysis for layout shifts and override conflicts
03Styling system detection for Tailwind, CSS-in-JS, and CSS Modules
04Comprehensive visual verification checklists for responsive states
05Systematic pattern matching to fix visual inconsistencies globally
06Automated visual issue categorization from screenshots
Casos de Uso
01Fixing inconsistent styling and design token usage across large applications
02Resolving complex layout and responsiveness issues identified by visual evidence
03Aligning existing UI components with design mockups or screenshots