Screen Information
Detailed information about your display as reported by the browser APIs.
Understanding these values
- Device Pixel Ratio: Higher values mean HiDPI/Retina scaling. 2x = each CSS pixel uses 4 physical pixels.
- Color Depth: 24-bit = 16.7M colors (8 bits/channel). 30-bit = 1 billion (10-bit panel).
- HDR Support: Indicates if your browser and display support high dynamic range content.
Testing guide
What your screen information means
This page reports what your browser knows about your display: resolution, device pixel ratio, color depth, orientation, touch support and HDR capability. Those values explain a lot of everyday confusion, particularly why a 4K monitor reports 1920 by 1080 in some places and 3840 by 2160 in others.
Best for
- Confirming what resolution your system is actually sending to the display.
- Checking whether your browser reports HDR and high color depth support.
- Finding your device pixel ratio when debugging scaling or high-DPI rendering.
How to run the test
- 1Open the page on the display you want to check, in the browser you normally use.
- 2Compare the reported screen resolution against your display native specification.
- 3Multiply screen resolution by device pixel ratio to get the effective physical resolution.
- 4Repeat in a different browser if a value looks wrong, since reporting differs between engines.
How to read the result
Screen resolution below your panel native resolution means the system is not running at native, which softens everything.
A device pixel ratio above 1 means the operating system is scaling, so CSS pixels no longer map one to one with physical pixels.
A color depth of 24-bit means 8 bits per channel; 30-bit indicates a 10-bit panel and signal path.
Related tools and guides
Frequently asked questions
Why does my 4K monitor report 1920x1080?
Because the browser reports CSS pixels, not physical pixels. With 200 percent scaling, a 3840 by 2160 panel reports 1920 by 1080 with a device pixel ratio of 2. Multiply the two together and you get the real physical resolution.
What is device pixel ratio?
It is the number of physical pixels used to render one CSS pixel. A ratio of 1 means no scaling. A ratio of 2, common on Retina and high-DPI displays, means each CSS pixel is drawn using a 2 by 2 block of physical pixels, which is what makes text look smoother.
What does 24-bit color depth mean?
It means 8 bits for each of red, green and blue, giving 256 levels per channel and about 16.7 million colors in total. A 30-bit reading means 10 bits per channel, roughly 1.07 billion colors, which is what true HDR content expects.
Why does the HDR reading say No when my monitor supports HDR?
The browser only reports HDR when the whole chain is active: HDR enabled in the operating system display settings, a capable cable and port, and a browser that supports the detection. Chromium-based browsers are the most reliable for this.
What is the difference between screen resolution and available area?
Screen resolution is the full panel size in CSS pixels. Available area subtracts space permanently occupied by system interface elements such as the Windows taskbar or the macOS menu bar, so it reflects the usable region for windows.
Testing guide
What your screen information means
This page reports what your browser knows about your display: resolution, device pixel ratio, color depth, orientation, touch support and HDR capability. Those values explain a lot of everyday confusion, particularly why a 4K monitor reports 1920 by 1080 in some places and 3840 by 2160 in others.
Best for
- Confirming what resolution your system is actually sending to the display.
- Checking whether your browser reports HDR and high color depth support.
- Finding your device pixel ratio when debugging scaling or high-DPI rendering.
How to run the test
- 1Open the page on the display you want to check, in the browser you normally use.
- 2Compare the reported screen resolution against your display native specification.
- 3Multiply screen resolution by device pixel ratio to get the effective physical resolution.
- 4Repeat in a different browser if a value looks wrong, since reporting differs between engines.
How to read the result
Screen resolution below your panel native resolution means the system is not running at native, which softens everything.
A device pixel ratio above 1 means the operating system is scaling, so CSS pixels no longer map one to one with physical pixels.
A color depth of 24-bit means 8 bits per channel; 30-bit indicates a 10-bit panel and signal path.
Related tools and guides
Frequently asked questions
Why does my 4K monitor report 1920x1080?
Because the browser reports CSS pixels, not physical pixels. With 200 percent scaling, a 3840 by 2160 panel reports 1920 by 1080 with a device pixel ratio of 2. Multiply the two together and you get the real physical resolution.
What is device pixel ratio?
It is the number of physical pixels used to render one CSS pixel. A ratio of 1 means no scaling. A ratio of 2, common on Retina and high-DPI displays, means each CSS pixel is drawn using a 2 by 2 block of physical pixels, which is what makes text look smoother.
What does 24-bit color depth mean?
It means 8 bits for each of red, green and blue, giving 256 levels per channel and about 16.7 million colors in total. A 30-bit reading means 10 bits per channel, roughly 1.07 billion colors, which is what true HDR content expects.
Why does the HDR reading say No when my monitor supports HDR?
The browser only reports HDR when the whole chain is active: HDR enabled in the operating system display settings, a capable cable and port, and a browser that supports the detection. Chromium-based browsers are the most reliable for this.
What is the difference between screen resolution and available area?
Screen resolution is the full panel size in CSS pixels. Available area subtracts space permanently occupied by system interface elements such as the Windows taskbar or the macOS menu bar, so it reflects the usable region for windows.