help ukraine

We stand with Ukraine! If you're as appalled by Russia's abhorrent attack as we are, please support Ukraine and its people.

Retina support

On this page

Sirv can serve tailored images to Retina and hi-res displays.

There are 3 methods for doing this:

Use srcset

1. Use the srcset attribute in your img tag. This way the user's browser will automatically load the appropriate image according to their display's pixel density.
<img src="https://demo.sirv.com/look.jpg" srcset="https://demo.sirv.com/look.jpg?w=400 1x, https://demo.sirv.com/look.jpg?w=800 2x, https://demo.sirv.com/look.jpg?w=1200 3x" width="400" />


Retina image

Deliver retina images with Sirv.js

2. Alternatively, you can reference the sirv.js script in your page and Sirv will automatically detect the users display and serve hi-res images to hi-res screens and standard images to non-hi-res screens. Refer to the responsive imaging documentation and the responsive imaging examples.

Use your own JavaScript

3. Instead of opening sirv.js (option 2 above), you can use your own JavaScript to detect the users' display. Then you can fetch the appropriate hi-res or standard-res image at the dimensions you require.

Was this article helpful?

Get help from a Sirv expert