Search code examples
cloudinaryclient-hints

Can cloudinary know image container size of frontend and deliver image accordinly ?

I am aware we can get different quality images by cloudinary by specifying in the URL, but is it possible to get it done automatically?

can cloudinary know frontend image container size automatically & deliver the image accordingly?

Solution

  • Sure, In Cloudinary we have an option to use quality auto and then the quality results will automatically deliver.

    For example, for original image: http://res.cloudinary.com/demo/image/upload/sample.png (679 KB) When applying the q_auto: http://res.cloudinary.com/demo/image/upload/q_auto/sample.png (630KB)

    In regard to your second question, we can get the size of the container from the client hints and then use w_auto. you can read more information of how to achieve it here: https://cloudinary.com/blog/automatic_responsive_images_with_client_hints

    Furthermore, we offer an option to get the best format of the image by adding format automate. In this case: http://res.cloudinary.com/demo/image/upload/q_auto,f_auto/sample.png (42KB)