Use the Image web part

When you add a modern page to a site, you add and customize web parts, which are the building blocks of your page. This article describes how to use the Image web part. Use it to insert an image on the page, either from your site, your computer, or from the web.

Add an image to your page

  1. If you're not in edit mode already, click Edit at the top right of the page.

  2. Hover your mouse above or below an existing web part or under the title region, click Circled plus sign used to add a modern web part to a page , and then select the Image web part.

  3. Choose a recent image or get an image from a web search, your site, your computer, or a link.

    Note: Web search uses Bing images that utilize the Creative Common license. You are responsible for reviewing licensing for an image before you insert it on your page.

  4. Click Open or Add image (depending on where your image is coming from).

  5. Optionally, type a caption under the image in the web part.

  6. Click Edit web part Web part edit button (on the left) to add Alternative text (for people who cannot see the image).

Crop your image

You can crop an image without or without using pre-set aspect ratios.

  1. If you're not in edit mode already, click Edit at the top right of the page.

  2. Click the image you want to change. The toolbar for editing images will be displayed.

    Image toolbar

Crop using aspect ratio

Cropping with aspect ratio allows you to decide the proportion of the width and height of your image. The area outlined in blue in the following image shows a 1:1 (square) aspect ratio selection.

Aspect ratio crop example
  1. Click the Aspect ratios button Aspect ratio crop button.

    An additional toolbar will fly out, with options for different aspect ratios.

    Aspect ratio tools

    Select the aspect ratio you want. 16:9 is the left-most aspect ratio option, followed by 3:2, 4:3, and 1:1. You'll see a preview box to show you how your picture will be cropped. You can move the crop box within your picture to change area that is cropped.

    You can also rotate the crop box so to change how the aspect ratio orientation is displayed by clicking the Rotate crop box button Rotate crop box button.

  2. When you're done, click SaveSave.

Crop manually

Free crop example
  1. Click the Crop with free ratio button Crop without aspect ratio button to crop without using aspect ratio. Then drag one of the squares on each side of the image to make your image narrower, wider, taller, or shorter.

  2. When you're done, click SaveSave.

Undo or reset

Use the Undo button Reset image crop to undo all of the changes you've made at once, returning the image to the state it was in since you last saved.

Use a different image

Once you've selected an image, you can't select a different one. Instead, insert a new Image web part, and select your new image. Then, delete the previous web part if you desire.

See Also

Image Gallery web part

Hero web part

Connect with an expert
Contact us
Expand your skills
Explore training

Was this information helpful?

Thank you for your feedback!

Thank you for your feedback! It sounds like it might be helpful to connect you to one of our Office support agents.