Understanding Cloudflare Image Resizing

Learn how Image Resizing modifies images once they are retrieved from your origin server and cached in the Cloudflare edge network.


Overview

Image Resizing is only available to paid Cloudflare plans at the Business or Enterprise level.

Cloudflare Image Resizing allows several on-demand adjustments to images:

  • resizing,
  • adjusting quality, and
  • converting images to WebP format.

Image resizing behaves as a proxy on top of the Cloudflare edge cache to apply the adjustments that you specify. Delivering images this way to your end-users helps you save bandwidth costs and improve performance since Cloudflare allows you to optimize images already cached at the edge.

There are two ways of using image resizing:

You can enable Image Resizing by toggling the switch to On in the Speed app of the Cloudflare dashboard. Once enabled, analytics display in the Image Resizing section of the Speed app.

Learn more about Image Resizing from our blog post and developer documentation.


Limitations

There are a few limitations to Cloudflare Image Resizing:

  • Resizes and generates only JPEG, PNG, or WebP images
  • Supports ICC color profiles in JPEG and PNG images
  • Preserves EXIF metadata in JPEG images only if the JPEG doesn’t use EXIF rotation
  • Converts the first frame of GIF animations to a still image
  • Discards WebP image metadata
  • Doesn’t apply Cloudflare’s Polish feature to resized images
Resized images already have lossy compression applied.

Enable Image Resizing

Enable Image Resizing via the Speed app:

  1. Log in to the Cloudflare dashboard.
  2. Click the appropriate Cloudflare account for the domain where you will activate Image Resizing.
  3. Ensure the proper domain is selected.
  4. Click on the Cloudflare Speed app.
  5. Click the Optimization tab.
  6. Under File Size Optimization, locate Image Resizing.
  7. Toggle the switch to On.
  8. (Optional) Check the option to Resize images from any origin.

cf-dash-speed-image_resize-toggle.png

Image Resizing defaults to restricting resizing to the same domain. This prevents third parties from resizing any image at any origin. However, you can enable this option if you check Resize images from any origin.

Note that this restriction does not apply to image resizing requests coming from Cloudflare Workers. To apply this restriction, you need to include the appropriate logic in your worker code. 


Configure Image Resizing

Business and Enterprise customers can configure Image Resizing using a specifically-formatted URL in the HTML.

For example, to display an 80px by 75px thumbnail image located here:

https://example.com/uploads/avatar1.jpg

The unique URL will be:

<img src="/cdn-cgi/image/width=80,height=75/uploads/avatar1.jpg">

Image Resizing can be also be configured using a Worker.


Pricing

Image resizing is priced based on the number of requests to the image proxy per month. For example, if a page with Image Resizing enabled contains three images, three requests will be counted every time someone visits that page.

The monthly pricing for Business and Enterprise customers is outlined below.

Business customers get 100K images served per month for free. Each additional set of 100K images costs USD $10 per month.

Enterprise customers get 10M images per month for free. For more information about pricing for additional images, reach out to your Customer Success Manager.


Related Resources

Not finding what you need?

95% of questions can be answered using the search tool. This is the quickest way to get a response.

Powered by Zendesk