Build website variations with the AI Visual Editor
GrowthBook's rebuilt AI Visual Editor lets you create website experiment variations from a Chrome side panel. Describe a change in plain language or edit elements by hand. You can also generate images or start from a Figma frame, then review each change before it reaches visitors.
Build and review variations
Open the side panel next to the page you want to test, and work from an idea or an existing design:
- Describe edits in plain language, or use manual controls for individual elements.
- Preview each suggested change on the page, then accept it, reject it, or fine-tune it in Manual mode.
- Generate replacement imagery, or turn a Figma frame or mockup into a page component.
This lets you try a different headline or hero design without building each variation into your application. Design import handles one component at a time, not whole-page redesigns, so review generated designs before you accept them.
Prepare your site
The editor builds variations in your browser. To show them to real visitors, your site needs a GrowthBook front-end SDK, such as the Script Tag, JavaScript, or React SDK, or an Edge SDK. Turn on Include Visual Experiments on that SDK Connection. Without it, visual experiments are left out of the SDK payload and don't render.
GrowthBook Cloud Pro and Enterprise include the AI Visual Editor. AI mode also needs your organization's AI configuration. Design import needs a compatible GrowthBook server and a vision-capable model, and importing from Figma requires a Figma connection.
Getting started
- Install the AI Visual Editor extension from the Chrome Web Store, open its side panel, and click Connect with GrowthBook.
- Open the page you want to test, describe an edit, and review the proposal.
- Follow the AI Visual Editor setup guide to install the extension and connect your account.