CSS Media Query Builder

Build responsive media queries visually — min/max-width, device type, orientation, color scheme, reduced motion and more. Click a preset or configure your own.

Common Breakpoints

Width Conditions

Media Type

User Preferences

Orientation

Resolution (HiDPI / Retina)

Breakpoint Visualizer

768px → ∞
03204806407681024128015361920
CSS Output

    

Common Breakpoints — click to load