Media Query Generator
Generate correct CSS @media queries for any breakpoint. Supports mobile-first and desktop-first approaches.
320px — Mobile S
480px — Mobile L
640px — sm
768px — md
1024px — lg
1280px — xl
1536px — 2xl
1920px — Full HD
Copied!
Mobile-first means you write base styles for small screens, then use min-width queries to add styles for larger screens. It results in leaner CSS and better performance on mobile devices.