My monitor is 4K but the tool shows 1920x1080 — why?

Your OS is likely running at a scaled resolution (e.g., 200% scaling at 4K = logical 1920x1080). To run 4K at 100% scaling, go to Display Settings > Scale and Layout and set scale to 100%. Note that 100% scaling at 4K on a 27-inch monitor produces very small UI elements — 150% is the practical sweet spot for most 27-inch 4K displays.

What is devicePixelRatio (DPR)?

DPR is the ratio of physical pixels to logical CSS pixels. A standard 1080p monitor has DPR 1 — one physical pixel per CSS pixel. A Retina MacBook with 2560x1600 running at "1280x800" has DPR 2 — four physical pixels per CSS pixel. Higher DPR means sharper rendering of text and graphics but requires the UI to be DPR-aware to avoid blurry scaling.

Why is the 1px grid blurry on my Retina Mac?

On a Retina display, CSS 1px is actually rendered as 2×2 physical pixels. The "1px" grid you see is anti-aliased at the 2×2 level, appearing as a uniform medium gray rather than sharp black-white alternation. This is the correct behavior for Retina — the sharpness test only reveals scaling artifacts on non-HiDPI displays running below native resolution.

What do the concentric circles test for?

Circular patterns are the classic test for geometric distortion. Barrel distortion (circles appear puffed outward) is common in cheap curved monitors. Pincushion distortion (circles pinch inward) occasionally appears in old CRT monitors or displays with hardware configuration issues. On modern flat panels, circles should be nearly perfect.

How do I read the alternating line pattern?

The 1px-wide alternating black/white horizontal lines create a spatial frequency at the Nyquist limit of the display. At native resolution with no scaling, this should resolve as a medium even gray (50% black, 50% white evenly mixed). If you see a moiré pattern, distinct bright and dark lines, or irregular texture, scaling or signal processing is being applied.

Resolution Test

Detect your display resolution, test 1px grid sharpness, and check geometric accuracy with concentric circles.

Last updated: April 2026

Alternating lines should appear as even gray at native resolution — any pattern means scaling is active

What it does

Resolution Detection

Reads and displays screen.width, screen.height, devicePixelRatio, and window.innerWidth/Height — showing both physical and logical resolution so you can confirm native resolution is active.

1px Sharpness Grid

A canvas-rendered grid of 1-pixel-wide lines reveals any scaling or blur. On a display running at its native resolution with no OS scaling, lines appear sharp and uniform. Scaling causes aliasing.

Geometry Test

Concentric circles drawn at precise pixel intervals reveal barrel distortion, pincushion distortion, or horizontal/vertical scaling errors in the display panel or mount alignment.

Text Readability

Shows text at 8, 10, 12, 14, 16, 20, and 24px to assess at which sizes your display renders readable, sharp text — useful for choosing optimal DPI settings.

Alternating Line Pattern

A field of alternating 1px black and white horizontal lines should appear as a uniform medium gray. If it looks grainy or you see moiré patterns, scaling is active.

How to use Resolution Test

1
Open the tool
Navigate to devzone.tools/tools/resolution-test.
2
Read resolution info
The info panel shows your screen resolution, logical viewport, and devicePixelRatio. On Retina/HiDPI, DPR will be 2 or higher.
3
Enter fullscreen
Press F or click "Go Fullscreen" for accurate geometry testing.
4
Check the 1px grid
Look for sharp, clean lines. If lines appear fuzzy, you are not running at native resolution or OS scaling is active.
5
Assess the circles
Concentric circles should be perfectly round. Any oval distortion indicates a panel or scaling issue.

When to use this

Confirming native resolution is active

After setting up a new monitor, the resolution display confirms the OS is driving it at its native pixel count. A 4K monitor running at 1080p will show a low devicePixelRatio and blurry 1px grid.

Diagnosing blurry display

A common cause of blurry displays is OS scaling (150%, 200%) on a 1080p monitor. The tool shows the devicePixelRatio — a value above 1.0 on a non-Retina display indicates scaling that is causing blur.

Evaluating display sharpness for purchase

When comparing monitors in a store, load the resolution test to see which panels render the 1px grid with cleaner, sharper lines — indicating higher pixel density or better subpixel rendering.

Checking geometric distortion

Curved monitors and older CRTs can introduce barrel distortion where straight lines bow outward. The concentric circles pattern reveals this — circles should be perfectly round, not egg-shaped.

Native Resolution and Why Running Below It Always Looks Worse

Every LCD/OLED panel has a fixed physical pixel grid — the native resolution. Running at native resolution maps each GPU pixel to exactly one physical pixel, producing the sharpest possible image. Running below native resolution requires the display to "stretch" pixels to fill the panel, using interpolation algorithms that inevitably create blur and aliasing artifacts.

This is why a 1080p gaming monitor looks sharper than a 4K monitor running at 1080p compatibility mode, even though the 4K panel has higher pixel density. The 4K panel is doing internal scaling that compromises sharpness. Always run displays at their native resolution, and use OS-level scaling (which has different, less visible artifacts) if elements are too small.

Frequently Asked Questions

My monitor is 4K but the tool shows 1920x1080 — why?: Your OS is likely running at a scaled resolution (e.g., 200% scaling at 4K = logical 1920x1080). To run 4K at 100% scaling, go to Display Settings > Scale and Layout and set scale to 100%. Note that 100% scaling at 4K on a 27-inch monitor produces very small UI elements — 150% is the practical sweet spot for most 27-inch 4K displays.
What is devicePixelRatio (DPR)?: DPR is the ratio of physical pixels to logical CSS pixels. A standard 1080p monitor has DPR 1 — one physical pixel per CSS pixel. A Retina MacBook with 2560x1600 running at "1280x800" has DPR 2 — four physical pixels per CSS pixel. Higher DPR means sharper rendering of text and graphics but requires the UI to be DPR-aware to avoid blurry scaling.
Why is the 1px grid blurry on my Retina Mac?: On a Retina display, CSS 1px is actually rendered as 2×2 physical pixels. The "1px" grid you see is anti-aliased at the 2×2 level, appearing as a uniform medium gray rather than sharp black-white alternation. This is the correct behavior for Retina — the sharpness test only reveals scaling artifacts on non-HiDPI displays running below native resolution.
What do the concentric circles test for?: Circular patterns are the classic test for geometric distortion. Barrel distortion (circles appear puffed outward) is common in cheap curved monitors. Pincushion distortion (circles pinch inward) occasionally appears in old CRT monitors or displays with hardware configuration issues. On modern flat panels, circles should be nearly perfect.
How do I read the alternating line pattern?: The 1px-wide alternating black/white horizontal lines create a spatial frequency at the Nyquist limit of the display. At native resolution with no scaling, this should resolve as a medium even gray (50% black, 50% white evenly mixed). If you see a moiré pattern, distinct bright and dark lines, or irregular texture, scaling or signal processing is being applied.