ToolToUse

Color & Design

Screen Resolution Tester

See your screen resolution, browser viewport, pixel ratio and color depth — updating live as you resize.

Values describe the screen and window this page is viewed on; multi-monitor setups report the current screen only.

Reading your display…

Resolution vs viewport vs DPR

Your screen resolution is the full size of the display. The viewport is the part of it the web page can actually use — smaller once you account for toolbars, scrollbars and window chrome. The device pixel ratio tells you how many physical pixels map to one CSS pixel: a DPR of 2 means a "375 px" phone width is really 750 physical pixels across.

Why it matters

  • Responsive design breakpoints (like 768 px) refer to CSS pixels — the viewport row, not the raw resolution.
  • Images look sharpest when served at DPR × their displayed CSS size.
  • On multi-monitor setups, the values describe the screen this window is on.

Good to know

Frequently asked questions

Why is my viewport smaller than my resolution?

The browser window, scrollbars, OS taskbar and any zoom level all reduce the space a page can use.

What is a good DPR for images?

Serve images at 2× their display size for sharp results on most modern phones and laptops.

Does this tool upload anything?

No. All values are read locally from your browser and never sent anywhere.

Keep exploring

View all