Email Builder

A welcome email is the simplest useful layout: a logo, a greeting, one clear action, and a footer. You can build it from an empty canvas or start from the Welcome starter template on the Templates page.

1. 1
   Start from a blank canvas

   Open the editor. You already have one single-column row, which is all this email needs.
2. 2
   Add your logo

   Drag an Image block into the row. Select it, and in the property panel paste your logo URL, set alt text like "Acme logo", set width to something like 160px, and set alignment to centre.
3. 3
   Write the greeting

   Drag a Text block underneath. Double-click it on the canvas and type your headline — something like "Welcome aboard". With it selected, raise the font size to around 28px and centre it.
4. 4
   Add the body copy

   Drag a second Text block below. Double-click and write two or three sentences telling the reader what to do first. Leave the font size at 14–15px so it stays readable.
5. 5
   Add one call to action

   Drag a Button block in. Double-click to change its label to something specific like "Set up your profile", then paste the destination URL in the property panel. One button is better than three — pick the single most important next step.
6. 6
   Finish with a footer

   Drag a Footer block to the bottom. Edit the text to your company name and postal address, then paste your unsubscribe URL into the Unsubscribe link URL field. Export will not run until that field is filled.
7. 7
   Export

   Press Ctrl+E or click Export HTML. You get a single .html file ready to paste into your email provider.

Newsletters differ from a welcome email in one way that matters: they carry several stories, so you need side-by-side layout rather than a single stack.

1. 1
   Set up the masthead

   In the first row, add an Image block for your logo, then a Text block for the issue title (for example "This month at Acme"). Centre both.
2. 2
   Add a divider

   Drag a Divider block below the masthead to separate the header from the content. Set a light colour like #e2e8f0 so it reads as a subtle rule rather than a hard line.
3. 3
   Create a two-column story row

   Click "2 columns" below the canvas. You now have a row with two independent drop targets.
4. 4
   Put an image on the left

   Drag an Image block into the left column and set its URL. Set width to 100% so it fills the column rather than overflowing it.
5. 5
   Put the story on the right

   Drag a Text block into the right column with a short summary — two or three sentences. Then drag a Button block underneath it, labelled "Read more", pointing at the full article.
6. 6
   Repeat for more stories

   Add another 2-column row for each additional story. If you want to alternate sides, drag the image block into the right column instead. Blocks move across columns as well as within them.
7. 7
   Add social links and a footer

   In a final row, drag a Social block and fill in only the networks you actually use — leave the others blank and they will not render. Then add a Footer block with your address and unsubscribe URL.
8. 8
   Check it on mobile

   Use the mobile preview toggle in the toolbar to see the design at phone width before you export. Two-column rows stack vertically in the exported email, so check your text still reads well.

Visual Ideas builds and exports the email. It does not send it — you send with whatever provider you already use.

1. 1
   Fill in the unsubscribe link first

   Select your Footer block and paste the unsubscribe URL from your email provider. Most providers supply either a merge tag or a hosted preference-centre link; use whatever they document. Export stays blocked until this is set.
2. 2
   Confirm your images are publicly reachable

   Images are referenced by URL, not embedded in the file. Open each image URL in a private browsing window — if it loads without you being signed in, your recipients will see it too.
3. 3
   Export the HTML

   Press Ctrl+E or click Export HTML. A .html file downloads. Open it in a browser first as a quick sanity check that it looks the way you expect.
4. 4
   Paste it into your provider

   Most providers (Mailchimp, Brevo, MailerLite, Resend, Postmark and others) offer an option along the lines of "import HTML", "paste in code", or a custom-HTML campaign type. Use that rather than their drag-and-drop builder, which may rewrite your markup.
5. 5
   Send yourself a test

   Always send a test to yourself before the real send, and open it on a phone as well as a desktop client. Email clients vary more than browsers do.
6. 6
   Keep a backup

   Use Export design (JSON) as well as the HTML. The JSON file is what you re-import next month when you want to edit this email again — the exported HTML cannot be loaded back into the editor.