Retina support

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" />

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.