Create transformation flows

Flows let you automatically apply image optimization to requests on your zone.

Each flow pairs a set of conditional triggers (for example, image is a JPEG or PNG) with optimization parameters (for example, transcode to AVIF).

When an image request matches a flow, Cloudflare transparently rewrites it through the Images service and serves the optimized result.

You can use pre-built flows to handle migrations from other image optimization services (like Fastly) or create your own custom flows.

A provider flow is a translation layer that maps image URLs from another image optimization service to Cloudflare. Your existing URLs including provider-specific parameters continue to work without any changes.

Currently, Cloudflare supports flows for Fastly Image Optimizer. When enabled, Cloudflare automatically translates Fastly's parameters to their Cloudflare equivalents. For example:

• Fastly's brightness parameter accepts a range from -100 to 100, while Cloudflare's brightness works as a multiplier. The value is scaled accordingly.
• Fastly's orient parameter is mapped to Cloudflare's flip and rotate parameters.

A custom flow lets you define your own conditions and actions for image optimization.

This is well-suited for situations where you want to optimize your images broadly and consistently, such as:

• Automatic format conversion Transcode all images to modern formats like AVIF or WebP across your entire site.
• Responsive sizing Automatically resize images based on each user's device.
• Directory-based optimization Enforce a consistent size for all images in a particular path, such as 100x100 for images where the path contains /thumbnail.

Before setting up a flow, make sure that transformations are turned on for your zone under Images > Transformations in the Cloudflare dashboard .

When an image is requested on your zone, Cloudflare checks to see whether the request matches the conditions for any of your configured flows:

• Flows are evaluated from top to bottom in the order that they appear in the dashboard.
• If a request matches more than one flow, only the first matching flow will run.
• If no flow matches, then the request passes through to your origin unmodified.
• To control priority, you can reorder flows in the dashboard.

If the request matches a flow's conditions, then Cloudflare rewrites the URL to pass through the Images service with the specified parameters:

• A custom flow triggers only on requests for supported image extensions. HTML pages, CSS files, and other non-images are never affected.
• A provider flow evaluates requests based on provider-specific optimization parameters. For example, a Fastly provider flow triggers only when the request contains parameters like ?width, ?height, or ?fit. Cloudflare will ignore any unrecognized parameters.

In your request lifecycle, flows are evaluated after standard HTTP redirect rules:

• Any existing URL rewrites or redirect rules will be applied before Images evaluates the request, which may affect matching behavior.
• Flows include built-in loop prevention. If the request is already coming from the Images service, then the flow will not re-trigger on that subrequest.

Currently, Cloudflare supports flows to handle migrations from Fastly Image Optimizer.

To add a provider flow:

1. Log in to the Cloudflare dashboard and select your account.
2. Go to Images > Transformations and select your zone.
3. Select the Automation tab, then select Add provider flow.
4. Choose Fastly as the provider.
5. Save your flow.

In the Cloudflare dashboard, go to Images > Transformations and select the zone where you want to set up the custom flow.

Go to the Automation tab and select Add custom flow to open the side panel where you can configure your flow.

A custom flow is triggered when an incoming request matches all of the configured conditions in the flow:

• File extension Match requests for all image formats or only specific file extensions, such as JPEG, PNG, or WebP.
• URL path Match requests where the URL path matches a specified pattern, such as /images/* or /assets/thumbnails/*.
• Query parameter Match requests where the query string contains a specified parameter, such as orient.

Next, define the optimization parameters that should be applied when the flow is triggered.

You can apply multiple actions within a single flow. For the full list of available parameters, refer to Features.

The key parameters for most use cases are:

Set format=auto to automatically serve images in the most efficient format (e.g. AVIF, WebP) for each requesting browser.

If the browser doesn't support AVIF, then Cloudflare will fall back to WebP or a standard format.

Refer to format

Control the compression quality of the output image. Accepts either:

• A fixed value from 1 (low quality, small file size) to 100 (high quality, large file size).
• A perceptual quality level: high, medium-high, medium-low, or low.

Refer to quality

Override quality when a slow connection is detected via client hints. Accepts the same fixed or perceptual values as quality. This serves lower-quality (and smaller) images to users on slow networks without affecting users on fast connections.

Refer to slow-connection-quality

Set width=auto to automatically size images based on the requesting device.

Cloudflare determines the optimal width using either client hints (sent by the browser) or user-agent detection as a fallback.

You can fine-tune the width=auto behavior with the following sub-parameters:

To learn how width=auto works, refer to our guide on serving responsive images.

Select Save on the side panel to add your custom flow, then select Save on your list of flows to turn on your flow.