Audit and fix mobile responsiveness across web project routes with visual checks.
npx skills add https://github.com/howells/arc --skill responsive
Please help me install this Agent Skill. Skill: responsive Source: https://github.com/howells/arc/tree/main/skills/responsive Command: npx skills add https://github.com/howells/arc --skill responsive
Audit and fix mobile responsiveness across every page of a project, using Chrome MCP screenshots at two breakpoints (375px mobile, 1440px desktop). Design-aware: reads existing design docs to preserve aesthetic intent, not just "make it fit." Use when asked to "make it responsive", "fix mobile", "responsive audit", or after building a desktop-first UI that needs mobile adaptation.
Use the responsive skill to audit and fix mobile responsiveness across your project.
High-intent search queries and answers about installing and using this skill.
To audit mobile responsiveness, this skill systematically checks every page route using automated visual screenshots at 375px mobile and 1440px desktop breakpoints, then applies design-aware fixes to typography, spacing, and component behavior.
Container queries handle component-level responsive adjustments while viewport queries manage page-level layout changes, ensuring elements adapt correctly within their specific context and the overall screen width simultaneously.
The best way to fix mobile layout without losing aesthetic intent is reading existing design docs first to preserve the established spacing system and typography hierarchy before applying responsive adjustments.
You can verify UI rendering at mobile and desktop breakpoints by capturing automated Chrome MCP screenshots at 375px and 1440px widths, providing visual confirmation that layout fixes align with design requirements.
You should use a responsive audit after building a desktop-first UI that needs mobile adaptation, or when asked to make a project responsive and ensure full viewport and container query compliance.
Yes, the responsive audit works with existing design systems by reading your design documents first to preserve aesthetic direction and ensure spacing and typography adjustments match the defined hierarchy.
mrodrigues1Define visual design systems using typography, color, spacing, and iconography.
saranskumarPlan responsive layouts with breakpoints and content priority across mobile, tablet, and desktop.
GrimblazPolish UI designs through iterative screenshot-driven refinement with baseline comparisons.
EIS-ITSBuild mobile-first responsive layouts with media queries and relative units.
