What is Device Pixel Ratio?

Device Pixel Ratio (DPR) is the ratio of physical pixels to CSS pixels and affects sharpness and asset selection.

When to account for DPR?

- Serving high‑resolution images and icons

- Canvas rendering and touch target sizingWhen not to special‑case DPR? - Vector assets and scalable UI that remain crisp by designWhat is the anatomy of DPR?

- Common values: 1x, 1.5x, 2x, 3x

- Srcset and sizes for responsive images

- Impact on hit areas and borders