Responsive Design

Start with the smallest viewport and the most important content. Enhance progressively. If it doesn't work at 320px, it has no place at 1920px.

Scope

Use this skill when you:

• Design a layout for different viewports and devices
• Define or review breakpoints
• Implement mobile-first CSS strategies
• Implement responsive images and media
• Need to ensure touch optimization
• Set up responsive typography

Principles

1. Mobile First, Content First

Start with the smallest viewport and the most important content. Enhance progressively for larger screens.