DPR header
Deprecated
Avoid using this feature in new projects. This feature may be a candidate for removal from web standards or browsers.>
Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.
Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.
Warning:
The DPR header was standardized as Sec-CH-DPR and the new name is now preferred.
The HTTP DPR request header provides device client hints about the client device pixel ratio (DPR).
This ratio is the number of physical device pixels corresponding to every CSS pixel.
The hint is useful when selecting image sources that best correspond to a screen's pixel density.
This is similar to the role played by x descriptors in the <img> srcset attribute to allow user agents to select a preferred image.
If a server uses the DPR hint to choose which resource is sent in a response, the response must include the Content-DPR header.
The client must use the value in Content-DPR for layout if it differs from the value in the request's DPR header.
If the DPR header appears more than once in a message the last occurrence is used.
Servers that opt in to the DPR client hint will typically also specify it in the Vary header to inform caches that the server may send different responses based on the header value in a request.
| Header type | Request header, Client hint |
|---|---|
| Forbidden request header | No |
Syntax
DPR: <number>
Directives
<number>-
The client device pixel ratio.
Examples
A server must first opt in to receive the DPR header by sending the response header Accept-CH containing the directive DPR.
Accept-CH: DPR
Then on subsequent requests the client might send DPR header to the server:
DPR: 2.0
If a request with the DPR header (as shown above) is for an image resource, then the server response must include the Content-DPR header:
Content-DPR: 2.0
Browser compatibility
See also
- Device and responsive image client hints
Accept-CH- HTTP Caching: Vary and
Vary - Improving user privacy and developer experience with User-Agent Client Hints (developer.chrome.com)