← All tools

Media Query Range Generator

Generate inclusive width bounds with explicit px units in both modern and classic syntax.

media-query-range-generatorLOCAL WORKSPACE

Enabling local controls…

Local processing inputs

Local Worker: 10s startup, 1s processing. 32KiB per field, 1MiB complete result. Editing or clearing cancels work and stale output. Generated HTML/CSS is not mounted; remote image preview requires a separate action.

Preview and code

Edit fields and build a preview; complete code can be copied or downloaded.

Model and scope

Generate inclusive width bounds with explicit px units in both modern and classic syntax. Reject reversed ranges. Viewport/container mode and independent add-ons share this interval. Container mode ignores media type. Preview does not resize the browser or emulate print; inline-size width queries assume horizontal writing mode, and size containment affects intrinsic sizing. No URL/storage persistence.

Media Queries range context ↗ToolHub source controls ↗

How to use this tool

Edit the bounded fields, process locally, inspect the native preview, then copy or download complete code. Editing clears stale output.

When not to use it

Generate inclusive width bounds with explicit px units in both modern and classic syntax. Reject reversed ranges. Viewport/container mode and independent add-ons share this interval. Container mode ignores media type. Preview does not resize the browser or emulate print; inline-size width queries assume horizontal writing mode, and size containment affects intrinsic sizing. No URL/storage persistence.