Better Layout
Audits and refines interface layouts, grouping, alignment, responsiveness, and RTL mirroring to prevent clipping and breakage across all screen sizes.
Better Layout empowers Claude Code to build and audit robust, adaptive user interfaces by enforcing disciplined grouping, edge alignment, logical properties, and content-driven breakpoints. It methodically stress-tests UI code against container resizing, multi-language string expansion, 200% zoom levels, and bidirectional Right-to-Left (RTL) rendering. By replacing fragile styling hacks with modern CSS standards such as container queries, dynamic viewport units (dvh), and intrinsic flexbox/grid sizing, this skill ensures interfaces never clip, overlap, or degrade when viewed across diverse devices and localized contexts.