Images and the media library

Every image your website shows is a real file inside the website — not a link to somewhere else. The Media panel in the builder's rail is where those files live, and it is the same library the assistant, the section editor, and the code editor all draw from.

Getting an image in

There are three ways, and they all end up in the same place.

• Attach it in the conversation. While the chat is open, drag a photo anywhere over the builder and drop it, or use the paperclip. This is the usual way: you attach the picture and say where it goes — "use this as the header photo" — and the assistant places it for you.
• Upload it in the Media panel. Open Media and drag files onto the grid, or use the upload button. Nothing is placed on a page; the image is simply available. A drop on the grid goes to the library only — while the chat is open instead, every drop goes to the chat.
• Pick it while editing a section. Any image field in Edit mode opens the same library, with an upload button built in. See Editing your pages.

Uploads are one file at a time under the hood, so a batch of eight photos is eight uploads — you will see them land one by one.

Files Remote File Search or a website capture brings in land here too: videos in videos/, and documents and audio in files/. They are listed beside your images and can be renamed, moved and deleted the same way; an image field in Edit mode only offers images. Uploading in the Media panel takes images.

The panel has an Expand button (⌘⇧M) that opens the library full size over the workspace, which is the comfortable way to sort through a lot of pictures at once.

What happens to an uploaded image

Photos out of a phone or a camera are far larger than a web page needs, so every upload is optimized on the way in:

• Anything wider or taller than 2560 pixels is scaled down to fit.
• JPEG and PNG photos are re-encoded — usually to WebP — when that produces a smaller file without a visible difference.
• SVG, ICO, GIF, AVIF, and BMP files are stored exactly as you uploaded them. These formats are either already small or would be damaged by re-encoding.

The accepted formats are JPG, JPEG, PNG, WebP, GIF, SVG, ICO, AVIF, and BMP, and a single image may not exceed 50 MB, 50,000 pixels on its longest side, or 100 megapixels in all. If a file is refused, the message says which limit it passed — resize it and try again.

What you see in the panel is what a visitor downloads. There is no hidden "original" — the optimized file is the file.

If you need a file kept byte for byte — a print-resolution photograph, an illustration you will crop later — tick Keep originals in the expanded media manager before uploading. Large images make pages slower to load, so leave it off unless you have a reason.

Organizing the library

Images live under an images folder by default, and you can add folders of your own to keep a large site tidy — images/team, images/menu, and so on.

Selecting an image opens it with its dimensions, its file size, and where it is used — the pages that reference it, named as pages rather than as file paths. That list is the one thing worth checking before you remove anything.

From the panel you can:

• Copy URL to copy the complete dev-site address, including https:// and the site hostname. It points at the latest version of the image and can be pasted outside the builder. Copy <img> tag stays site-relative so the page source remains portable when you connect or change a domain.
• Rename a file or folder.
• Move an image into another folder.
• Duplicate an image, which is handy when you want a variant without losing the original.
• Delete an image or an empty folder.
• Search by name, which is faster than scrolling once a site has a few dozen pictures.

Renaming or moving an image changes its address, so any page that pointed at the old path now points at nothing. If the panel shows the image is used somewhere, either update those pages afterwards or ask the assistant to — "I moved the team photos into images/team, fix the About page."

Replacing an image

To swap a picture for a better one, upload the new file and point the page at it — either by clicking the image in Edit mode and choosing the new file, or by asking the assistant. Uploading a file with the same name as an existing one does not overwrite it; you get a second file with a distinct name, so nothing you already published can break by accident.

Alt text

Alt text describes the information an image communicates to someone who cannot see it. In AI Settings → Images, Automatically add image alt text is on by default, including for existing websites. Max writes descriptions as it places informative images during a conversation. Turning it off preserves existing text and lets you supply your own descriptions; it does not remove alt attributes or change existing images. Uploading a file to Media alone does not start an AI request or describe it automatically.

To save a description, expand Media, select the image, enter Image alt text, and choose Save alt text. Describe what the image communicates, without repeating its filename. Descriptions may contain up to 1,000 characters. Saving a description replaces the alternatives for informative uses of that image in the draft; review the preview and publish when ready. Copy image tag also includes your saved description.

Saved descriptions follow images when renamed, moved, or duplicated in Media. They belong to the website version, so a draft edit does not change the published version. For a different description in one particular context, ask Max to use a separate copy of the image.

Decorative images — a background texture, a divider — are marked as decorative instead, so a screen reader passes over them rather than announcing a filename. Saving a library description leaves existing decorative uses alone. Background images in CSS do not receive HTML alt attributes.

Branding images

The images on the Branding page — your logo, logo mark, mobile logo, dark-background logo, favicon, Apple icon, and social sharing image — are kept in the library too, in an images/branding folder, named after the slot they fill (desktop-logo.png, favicon.png, and so on). They carry a Branding asset badge in the grid, and the detail panel names the slot each one fills.

They are ordinary files: you can open them, copy their address, and reference them from a page. What you should not do is delete one casually. Deleting a branding image empties its slot, and your website has no logo (or no favicon) until you choose a replacement — so the delete dialog says which slot it is about to empty before you confirm.

To change one, use the Branding page rather than uploading a replacement here: that keeps the file, the slot, and every page that reads it in step. There is a Choose from media option on every slot, so an image already in this library never has to be uploaded twice.

Where images actually live

If you turn on developer mode, you will find the same files in the Files panel under public/images. The Media panel is a friendlier view of that folder, not a separate store, and everything you do in one shows up in the other.

Next

• Editing your pages — placing and swapping images directly on the page.
• Branding — your logo, favicon, and social sharing image, and the slots they fill.