Help us improve
Share bugs, ideas, or general feedback.
From frontend-craft
Designs, implements, and reviews responsive frontend layouts with mobile-first breakpoints, container queries, fluid grids, touch targets, and cross-device behavior.
npx claudepluginhub bovinphang/frontend-craftHow this skill is triggered — by the user, by Claude, or both
Slash command
/frontend-craft:fec-responsive-layoutThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
Suitable for front-end tasks that require pages, tool interfaces, tables, dashboards or components to work stably on multiple devices. Load [references/responsive-layout-patterns.md](references/responsive-layout-patterns.md) when layout patterns and checklists are required.
Implements responsive web layouts using mobile-first strategies, min-width breakpoints, fluid CSS Grid, container queries, srcset/picture images, 44x44px touch targets, and mobile-adapted tables.
Guides responsive layout design for complex UIs: content-driven breakpoints, priority shifting, clamp typography, container vs media queries, touch targets, and multi-device testing.
Guides content-first responsive design: setting breakpoints where content breaks, mobile-first prioritization, and five responsive layout patterns.
Share bugs, ideas, or general feedback.
Suitable for front-end tasks that require pages, tool interfaces, tables, dashboards or components to work stably on multiple devices. Load references/responsive-layout-patterns.md when layout patterns and checklists are required.
Design responsive layouts in a content-first, mobile-first, and container-aware manner to avoid relying solely on fixed breakpoints to fix overflow.
minmax(), clamp(), aspect-ratio, max-width, min-width: 0 and stable grid track to control scaling.Outputs responsive information prioritization, breakpoint or container strategies, key component layout patterns, touch/keyboard requirements, data-intensive area handling options, and validation results. After completion, the page will not overflow, not be blocked, and is operable under common viewports and input methods.