Why is my image blurry?

Image blurriness can occur for several reasons. Two of the most common reasons and potential solutions are listed below:

Device pixel ratio (DPR) not taken into consideration

Most devices have a DPR greater than 1 and sometimes greater than 2.
When delivering images to devices with a DPR greater than 1, you'll want to proportionately increase the pixels in the image as well.

For example, in order to generate an image to be displayed on a device with a DPR of 2.0, all you need to do is set the dpr transformation parameter to 2.0:

https://res.cloudinary.com/demo/image/upload/c_fill,w_100,h_100,g_face,dpr_2.0/smiling_man.jpg

You can then use this version of the image and display it in the same container as you would for the original version and it will look sharper.

For more information on DPR, check out this blog post on the subject:

https://cloudinary.com/blog/how_to_automatically_adapt_website_images_to_retina_and_hidpi_devices

Resizing images leads to blurriness

Image resizing may cause some blurriness, whether you are scaling up or down. For example, a 300x300 image has 90,000 pixels, but scaling the same image down to 100x100 means there are 10,000 pixels to store the same amount of data, making the image look less sharp and clear. This is expected and would happen independently of how you resize the image. When scaling images down, some images may look better than others, but that depends on the image's colors, lining, models, etc.

In addition, this issue is even worse when scaling up from a smaller image to a larger size. 

A couple potential solutions for this are using the e_sharpen and/or e_improve transformations.

Original 292x282 image scaled up to 700x676:
https://res.cloudinary.com/demo/image/upload/w_700/front_face.jpg

With e_sharpen:
https://res.cloudinary.com/demo/image/upload/w_700,e_sharpen:200/front_face.jpg

With e_improve:
https://res.cloudinary.com/demo/image/upload/w_700,e_improve/front_face.jpg

More information about e_sharpen and e_improve can be found in our transformation URL API reference documentation:
https://cloudinary.com/documentation/transformation_reference#e_sharpen
https://cloudinary.com/documentation/transformation_reference#e_improve