Josh Liljenquist

Private, browser-local utility

CSS Media Query Generator

Build bounded width and preference conditions and copy a formatted CSS @media block.

Values stay in this tab and generate plain CSS only.

Loading local tool…

Combination and unit policy

V1 supports min-width, max-width, a bounded min/max range, screen/print/all media types, portrait or landscape, prefers-color-scheme, and prefers-reduced-motion. Chosen conditions are joined with logical and.

Widths accept 0–10,000px or 0–625rem. A rem number is emitted directly; the tool performs no hidden 16px conversion. Negative values, unsupported units, and ranges whose maximum is below their minimum are rejected. Arbitrary Media Queries Level 5 syntax is outside V1.