You don't have to start a page from a blank canvas or describe every detail in words. The Divi AI Agent can take a picture of a design you like, the address of a page you admire, or a handful of mood images, and turn any of them into a working Divi 5 layout - real sections, rows, and modules you can keep editing.
What You Can Start From
The Agent can build from any of these, alone or combined in the same request:
A written brief - a plain description of what you want, with no image at all.
A screenshot or mockup - an image of a page or component you want to reproduce.
A website URL - a live page on the public web.
A moodboard - a handful of images that capture a color palette or mood rather than a layout to copy.
Whichever you start from, work in Build mode so the Agent can actually create the layout instead of only describing it.
Building From a Written Brief
If you don't have anything to attach, describe the outcome directly: what the layout is for, how it's structured, and any styling you already know you want.
Example:
Build a two-column hero for a boutique coffee subscription: a bold headline and a signup button on the left, and room for a product photo on the right. Keep the palette warm and earthy, nothing neon.
The Agent turns that into a real section on your page, with a heading, a button, and an image placeholder already laid out.
Note: A good prompt can make the difference between a generic layout and a truly unique one. For more details regarding prompting, check out the How to Write Good Prompts for the Divi AI Agent article.
Building From a Screenshot
Attach the image you want to reproduce, then describe what to keep and what to change.
Example:
I attached a screenshot of a landing page I like. Build a similar hero here using its layout and spacing, but write a new headline: "Fresh-Roasted, Delivered Weekly."
Only JPEG and PNG images can be attached. For more details, check out the How to Add Context to the Divi AI Agent article.
Building From a Website URL
You don't need a screenshot if the design already lives on the public web - just give the Agent the address.
Example:
Read the pricing page at this address: acmewidgets.com/pricing. Build a similar pricing section here, same layout and column count, but write new plan names and copy for my own product.
The Agent fetches the page, reads its structure and styling, and generates a Divi layout from what it finds. This only works for a page it can reach directly, so it needs a public address, not one behind a login.
Building From a Moodboard
A moodboard isn't a layout to copy - it's a set of images that say "this palette" or "this feel," and you leave the structure to the Agent.
Example:
I attached four images for the color palette and mood I'm after. Use them as style reference only, not as a layout to copy, and build a three-part landing page: a hero, a three-item feature row, and a closing call to action.
Being explicit that the images are for style, not structure, keeps the Agent from trying to mimic a moodboard's collage-like arrangement.
Bringing the Images and Fonts With It
If your reference material includes assets you actually want to keep - product photos, brand images, a licensed font file - attach those too and ask for them by name.
Example:
Import the two images I attached into the Media Library, and install the font file I attached as a custom font. Use that font for the headline you just built, and put the first image in the hero.
The Agent treats these as two separate jobs: importing attached images into your Media Library, and installing an attached font file as a Divi Custom Font. Neither happens automatically just because the file is attached - ask for it explicitly.
Refining the Result
A generated layout rarely lands exactly right on the first pass, and that's expected. Point the Agent at what's off instead of starting over.
Example:
Compare the hero section you just built to the screenshot I attached, focus on spacing and colors, and tell me what's different before you change anything.
The Agent takes a screenshot of what it actually built, compares it against your reference image, and reports back specific differences instead of you having to spot them yourself. Once you've seen the list, ask it to apply the fixes.
What to Expect
What comes back is a real Divi layout - actual sections, rows, and modules, with real content and real styles, not an image and not a block of code you have to paste in somewhere.
You can click into any of it afterward and adjust it exactly the way you would anything you built by hand.
Treat the first result as a strong starting point, not a finished page. The Agent aims for a similar design in the same spirit as your reference, not a pixel-for-pixel copy of it - expect to spend a round or two refining spacing, copy, and colors until it matches what you had in mind.