What is device pixel ratio?
Your device pixel ratio (DPR) is shown in the result: how many physical pixels your screen uses to draw one CSS pixel. A ratio of 2× means each CSS pixel is two physical pixels wide and two tall.
What the numbers mean
- 1×: one physical pixel per CSS pixel, typical for standard desktop monitors
- 1.25× to 1.5×: common Windows laptops with display scaling at 125% or 150%
- 2×: Retina Macs, iPads and many laptops
- 3× and above: most modern iPhones and Android phones
Why it matters
Websites measure everything in CSS pixels so that text and buttons appear at a similar physical size on every screen. The pixel ratio tells the browser how much detail it can show:
- Images: sites can send higher-resolution images to 2× and 3× screens, so photos look sharp instead of blurry.
- Text and icons: fonts and vector icons are drawn at full screen resolution automatically.
- Physical resolution: multiply your screen resolution by the pixel ratio to get your display’s real pixel count.
How zoom changes the ratio
In most browsers, zooming in increases the device pixel ratio and shrinks the viewport by the same factor. If the displayed value looks unusual, check your browser’s zoom level and reset it with Ctrl + 0 (Cmd + 0 on a Mac).