Images in AI Website Creator
Learn how to select, replace, upload, reuse and crop images in the AI Website Creator Design Editor.
Use the image panel to change the picture in an existing section without replacing its layout. Choose stock media, upload your own file, reuse a project asset or crop the picture for a better composition.
At a Glance
| Task | Where to start | What changes |
|---|---|---|
| Select a picture | Click the image on the canvas | Opens its image panel |
| Replace a picture | Replace | Changes the selected image slot |
| Find stock media | Replace > Stock | Browse Photos, Art or 3D |
| Reuse or upload | Replace > Library | Uses the current project's media library |
| Reframe a picture | Crop image on the preview | Creates a cropped image asset |
Select an Image
Select the picture
In the Design Editor, click the image you want to change. Its image panel opens with a preview of the selected picture. The canvas selection label helps you keep track of the selected element. Brand logos and icons have their own controls, so they do not behave like ordinary photographs.
Choose the task
Use Edit Image for the selected image's controls, or Replace to choose different media. Check the preview before you apply an edit, especially when several images appear in one section.
For a picture used behind section text, double-click the background area to open the background image in the image panel. Use the section panel instead when you want to adjust the section's overlay.
Replace an Image with Stock Media
Open Replace > Stock. Enter a subject in Search, then choose Photos, Art or 3D. Click a result to put it in the selected image slot.
Search for the subject and setting rather than a broad industry alone. For example, try ceramic mug on a wooden cafe table instead of cafe. Check that the image has room for any text placed over it.
The section keeps its layout when you replace its image. A picture with a different shape may be cropped by that layout. Review the result at desktop and mobile widths.
Upload and Reuse Project Images
Open Replace > Library. Click or drag an image into the upload area. Once it finishes uploading, choose its thumbnail to replace the selected picture. A pending tile shows an upload that is still being processed.
The library is scoped to the current project. It includes more than manually uploaded files.
| Filter | What it includes | Default or limit |
|---|---|---|
| All | All image sources in this project | Initial filter |
| Uploads | Uploaded images and logo assets | Current project |
| Generated | AI-generated images and AI-edited outputs | Current project |
| Stock | Stock images already added to the project | Not the external stock catalogue |
| Search library | Searches the project library | Combine with a source filter |
Use Stock outside the library to find new stock images. Use the library's Stock filter to find pictures you have already used. If the library is empty, upload a file or add an image to the project first.
Crop and Reframe an Image
Open the crop dialog
Select the image, then click Crop image on the image preview. Cropping is a local image edit, not an AI generation.
Choose the shape and framing
Keep Original to preserve the existing slot or image shape. Choose Free, 1:1, 4:3, 3:4 or 16:9 when you deliberately want a different shape. Drag the image and adjust Zoom to frame the subject.
Rotate, flip or reset
Use Rotate left, Rotate right or Flip horizontally when needed. Reset restores the dialog's initial framing. Cancel closes the dialog without applying the crop.
Apply the crop
Click Apply crop. The cropped result is saved as an image asset and replaces the selected picture. Review the actual section afterward, because its layout can still crop an image that has a different aspect ratio.
Crop does not use AI tokens. The dialog starts from the original source rather than repeatedly cropping an already cropped output.
Choose Crop or an AI Mask
Cropping removes the outer parts of a picture. A mask marks an area inside the picture for Generative Fill or Magic Eraser. Use crop for framing; use an AI mask when you need to change the contents of the picture. See the AI image tools guide for the brush workflow.
Image Display and Accessibility
Use Original in the crop dialog when keeping the section's shape matters. The current image panel does not expose a separate functional Position, focal-point or image-fit picker. Do not expect those controls to appear beside the crop tool.
Image alt text is not an editable field in this panel. Review accessibility in your final website workflow rather than assuming replacing a picture also writes a new description.