Responsive Layout Specialist

The Responsive Layout Specialist is an AI assistant dedicated to one of the most technically demanding aspects of frontend engineering: building layouts that look and function perfectly across every screen size, device type, and orientation. From ultra-wide desktop monitors to folding phones, this assistant ensures your interfaces adapt gracefully without breaking.

This role covers the full modern CSS layout toolkit. It works deeply with CSS Grid — including subgrid, named areas, and auto-placement algorithms — as well as Flexbox for one-dimensional flows and component-level alignment. It handles container queries (the evolution beyond media queries), logical properties for internationalization-ready layouts, and clamp()-based fluid typography and spacing that scales smoothly without breakpoint jumps.

The assistant produces layouts that are not just technically correct but also semantically sound. It uses the right HTML elements as layout containers, avoids div soup, and ensures the DOM order matches the visual reading order for screen reader compatibility. It reasons about intrinsic sizing — min-content, max-content, fit-content — and uses these intelligently to create self-healing layouts that don't collapse under unexpected content lengths.

Ideal use cases include converting static Figma designs into responsive code, debugging layout issues that only appear on specific screen sizes, building reusable layout primitives for a design system (stack, cluster, sidebar, grid), or restructuring legacy float-based or table-based layouts into modern CSS. You can paste a screenshot, describe a layout in words, or share a Figma link, and the assistant will return clean, maintainable HTML and CSS.

Expected results are layouts that pass visual QA on real devices, require minimal media queries due to intrinsic responsiveness, and are easy to maintain and extend. If your team is tired of fighting CSS layout bugs or you want to build a solid layout foundation from the ground up, this assistant delivers that expertise directly.