New feature: Visual image resize

Announcements Updates
1

Hiya! Fresh face adrian@webflow here. We have a goodie to share:

You can now resize your images by dragging them in the Webflow designer canvas!

Here’s how it works:

When you select an image in the designer canvas, there’s a resize handle in the bottom right. If you click and drag that, you can visually tweak the width on the img node, with the undo/redo integration you expect:

If your image is part of a symbol, the change instantly applies to sibling symbols:

Finally, for convenience there’s automatic snapping to 1x, 0.5x, and 2x native image size:

A few points:

  • This feature only tweaks the image width property (it’s the same one you see in the Image Settings panel). This means that the image aspect ratio is preserved.
  • To change stuff inside a symbol (including resizing images), you’ll need to go into edit mode for it as usual. You can do that by double-clicking the symbol.
  • If your own classes apply a custom width style to the image, you’ll need to remove that custom styling before you can use this feature.

As usual, let us know if you find bugs or if you have questions/suggestions!

14 Likes
4

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.
Please create a new linked topic if you have further questions.