hints / device

Sec-CH-DPR

Sec-CH-DPR reports the device pixel ratio to the server, enabling resolution-appropriate images without srcset gymnastics. Successor to the legacy DPR header.

requires Accept-CH Device
Example
Sec-CH-DPR: 2
JavaScript
window.devicePixelRatio
Available since
Chrome 46 (2015) as DPR; Sec-CH-DPR naming since Chrome 90
Supersedes
DPR (2015 draft, still honored)
Engines
Chrome Edge Opera Firefox Safari
References
MDN · Specification

Sec-CH-DPR tells the server how many physical pixels back one CSS pixel: 1 on a standard display, 2 on most retina-class screens, fractional values like 1.25 on scaled Windows desktops.

Accept-CH: Sec-CH-DPR

Sec-CH-DPR: 2

Unlike the UA hints, the value is a bare number, unquoted.

What it’s for

Server-side image selection. An image service that receives the DPR can pick the right rendition without the client enumerating candidates in srcset:

GET /photos/handbag.jpg HTTP/1.1
Sec-CH-DPR: 2
Viewport-Width: 390

HTTP/1.1 200 OK
Content-DPR: 2
→ serves the 780px-wide file

Note Content-DPR in the response: when you serve a different intrinsic size than the URL implies, this confirmation header tells the browser how to display it at the intended CSS size. Image CDNs (Cloudinary, Akamai, Fastly image optimizers) speak this protocol fluently; it mostly runs between browsers and CDNs rather than application code.

The 2015 generation

This hint predates the whole Sec-CH- convention: it shipped in 2015 as plain DPR, one of the original four device hints (DPR, Width, Viewport-Width, Device-Memory). Chromium accepts and sends both spellings when you opt in with the legacy name, and image CDN documentation still overwhelmingly says DPR. New configurations should request the Sec-CH- form (the Sec- prefix guarantees the header can only originate from the browser itself, not from scripts), but expect to see the bare names in the wild for years.

In JavaScript

window.devicePixelRatio  // 2 on this class of display

Available everywhere since forever; the header is the Chromium-only part. If you operate your own image resizing service, this plus Sec-CH-Viewport-Width and Sec-CH-Width replaces a surprising amount of client-side markup.