intermediatewebflowimages

How to replace an image in Webflow?

Flowversity··3 min read

Replacing an image in Webflow can mean different things depending on the context: swapping an image on a static page, updating an image in the CMS, or replacing an asset globally. Each approach works slightly differently.

Replace an image on a static page

For images placed directly on a page in the Designer:

  1. Select the Image element on the canvas.
  2. In the Settings panel on the right, click the current image thumbnail.
  3. Choose a new image from your Assets or upload a fresh file.
  4. The replacement inherits the same dimensions and styling as the original.

If the new image has different proportions, you may need to adjust the element's sizing or set it to cover or contain under the Size setting.

Replace a background image

Background images are set through the Style panel, not the Settings panel.

  1. Select the element with the background image.
  2. Go to the Style panel and scroll to the Background section.
  3. Click the current background image thumbnail.
  4. Choose or upload a new image.

The new image will use the same background position, size, and repeat settings as the original.

Replace a CMS image

CMS images are edited per item, not globally.

  1. Go to the CMS tab.
  2. Open the Collection and select the item you want to edit.
  3. Click the image field and upload a new file or select from Assets.
  4. Save and publish the item.

Replace an asset in the Assets panel

Webflow does not have a "replace file" button that updates all instances of an asset. If you need to swap an image everywhere it is used:

  1. Upload the new image to the Assets panel.
  2. Manually update each element that referenced the old image.
  3. Delete the old asset once it is no longer in use.

This is one reason it helps to use CMS image fields for frequently updated content rather than static assets.

Common issues

Image looks stretched after replacing — The new image likely has different proportions. Set the Image element to cover mode and ensure the container has defined dimensions.

Old image still showing on live site — After replacing an image, you must publish the site again. Changes in the Designer do not appear on the live site until published.

CMS image not updating — Make sure you published the CMS item after editing. Draft changes are not visible on the live site.

Want to skip the build?

Browse 60+ premium templates and launch your site in days, not weeks.

Explore Templates