Responsive Design

This is your go-to reference for building layouts that work across devices without fighting CSS. It covers the practical stuff: mobile-first media queries with sensible breakpoints, flexbox for navigation and card layouts, CSS Grid with named areas for page structure, and container queries for component-level responsiveness. You'll find working examples of fluid typography with clamp(), auto-fit grids that reflow naturally, and responsive image techniques with srcset. The code samples are production-ready, not toy examples. If you're tired of pixel-perfect designs breaking on real devices or writing defensive CSS that fights itself, this gives you patterns that actually scale. It also covers the modern niceties like prefers-reduced-motion and hover detection so your interfaces feel native on both touch and pointer devices.

Install to Claude Code

npx -y skills add manutej/luxor-claude-marketplace --skill responsive-design --agent claude-code