Sections, themes, assets, and importing
Pick from the section library, theme the whole site, manage image assets, generate AI imagery, or match an existing design.
Beyond chat and click-to-edit, the workbench gives you a handful of "drop-in" surfaces for accelerating common tasks: a section library, themes, an asset library, AI image generation, HTML / ZIP import, and Match-a-site.
Section library
The section library is a catalog of pre-built page sections you can drop into any page. Open it from the + Section button on the page tab, or from the inline insert prompt that appears when you hover between two existing sections.
Categories include hero, features, services, pricing, testimonials, FAQ, team, gallery, contact, footer, and more. Each section has multiple variants — pick the one that fits your page best, and Claude will recolor and rewrite it on insert so it matches the rest of the site (using the brief as context). Insertion is free if you pick a stock variant and only re-themes via Claude when the variant doesn't already match — usually one short call.
Themes
A theme is a coordinated set of colors, fonts, button shapes, and shadow strengths. Open the Theme drawer from the top bar to swap themes. Each theme preview applies to a sample card so you can see the impact before committing. Click any theme to apply it across the entire site — every page rebuilds in the background and the preview hot-reloads when ready.
Themes change presentation only. Layout, copy, and structure are preserved. If a theme accidentally tints something you want to keep on-brand, override that single element via the Style tab.
Asset library
Every site has its own asset library for images. Open it from Assets in the top bar (or anywhere a "Pick an image" button appears). You can:
- Upload — drag & drop PNG, JPG, WebP, SVG, GIF up to 10 MB each. Files are stored on the same server and served from
/api/asset/...URLs that work in both preview and published builds. - Replace — click any image card to copy its URL or replace the file in place (all references across the site auto-update because they all point at the same asset URL).
- Delete — remove an asset. The deletion is instant, but if any page still references it the references will 404. Audit first.
AI image generation
Need an image you don't have a photo for? Click Generate inside the asset library or any image-picker context. Describe the image (subject, style, mood, color cues), pick an aspect ratio (square, wide, portrait), and click Generate. The result lands in your asset library and is immediately usable across the site. Each generation consumes credits — the cost is shown before you commit.
Tips for better generations: be specific about subject and style ("photorealistic close-up of espresso pour, warm morning light, shallow depth of field" beats "coffee photo"); specify what you do not want (e.g. "no text, no logo, no people"); regenerate if the first result isn't right rather than trying to fix it in editing.
Import HTML or a ZIP
Already have a hand-built HTML page or a Webflow / Framer export? From the workbench top bar, click Import:
- Paste HTML — paste a single HTML document. We parse it, separate inline CSS / JS, ingest assets it references, and load it as a new site or replace the current page.
- Upload ZIP — upload a multi-file site ZIP. We walk the directory, treat
index.htmlas the home page, route subfolders to slug-based subpages, and copy/images,/css,/jsinto your asset library.
Imported sites are fully editable from the moment they land — every editing surface (chat, click-to-edit, inline text, code panel) works the same way.
Match-a-site
The fastest way to start from a reference: paste a URL into the Match-a-site dialog and we generate a new site that mimics the layout, sectioning, and visual style of the reference (without copying its actual content or imagery). Useful when a client says "build me something like this competitor". Match-a-site uses one larger Claude call upfront, then you iterate normally.
We do not download the reference site's images, copy, or code. The output is original markup themed in a similar direction. Always review for any unintentional similarity before publishing.