Responsive Image
Generation Test

Webflow generates responsive images and corresponding tags under certain conditions. The question is when. This test suite tries to answer that. I don't have it completely nailed down, but it's close. -- @webdev / Webflow Forum

This color indicates Webflow responsive generated image code


The dimensions test (no responsive generated images) demonstrates that it is not just the dimensions that trigger responsive generation.

Dimensions and Size

This test uses both size and dimensions to determine when responsive images are generated.
I will let you draw your own conclusions. Further isolation might be warranted, if I have time.

Dimensions: 120x120 Size: 5kb
Dimensions: 300x300 Size: 20kb
Dimensions: 396x396 Size: 46kb
Dimensions: 400x400 Size: 101kb
Dimensions: 450x450 Size: 126.1kb
Dimensions: 450x450 Size: 176.7kb
Dimensions: 500x500 Size: 150.3kb
Dimensions: 550x550 Size: 56kb
Dimensions: 550x550 Size: 175.6kb
Dimensions: 600x600 Size: 91.2kb
Dimensions: 600x600 Size: 200.2kb
Dimensions: 850x850 Size: 159.4kb
Dimensions: 900x900 Size: 171.9kb
Dimensions: 1800x1800 Size: 428.2kb
Dimensions: 2400x2400 Size: 618.7kb
Dimensions: 3600x3600 Size: 1.03mb
Dimensions: 1600x1600 Size: 107.6kb