Make my emails look like my site
An email that looks like your website is an email people recognise before they read a word of it. Bernard does that for you. You do not choose colours, sizes or typefaces anywhere in the email editor, and there is no theme to set up.
What Bernard takes from your site
Six things, and no more:
- An accent colour. Your name at the top of the message, the button, and the tint on the dividing line.
- An ink colour for headings.
- A body colour for ordinary paragraphs, a shade lighter than the headings.
- A quiet colour for small labels and the sign-off.
- A background for the message to sit on.
- A typeface family for the headings and the body.
Everything else about the design stays as Bernard wrote it: the spacing, the sizes and the rhythm. Those carry the message. The colours carry your name.
Where it gets them
Bernard asks three sources in order and stops at the first that answers.
- Your style. The colours you saved on your site's Your style page, and the sentence you wrote about your typography. This is what you can see and change, so it wins.
- Your site itself. If you have saved nothing, Bernard uses the colours and the typeface names it counted in your site's own stylesheet when it read your site.
- The plain design. If neither answers, the email is black ink on white with one hairline rule. It is quiet on purpose, and it suits every brand because it argues with none of them.
The Templates tab says which of these it used, and shows the accent colour as a small swatch beside it, so you never have to guess whether a design followed your site or ignored it.
About the typeface
This is the one place an email cannot do what a website does, and it is worth knowing why.
A website can send a font file to the browser along with the page. An email cannot rely on that. Outlook drops downloaded fonts outright, and Gmail's clipped view drops them too, so a message built on a web font would arrive in whatever the reader's mail app fell back to, and you would never see it happen. There is no second chance to restyle a message once it has been sent.
So Bernard matches the family rather than the font. If your site is set in a serif, your email is set in a serif that is already on the reader's machine. If your site is a geometric sans, so is your email. The families Bernard chooses between are: system sans, serif, geometric sans, grotesque sans, humanist sans, slab serif and monospace.
The result reads as yours. Put your site and your email side by side and the letterforms will not match exactly. Nobody reading their inbox is doing that.
Making sure Bernard can see enough
If your emails look plainer than you expected:
- Open your site's Your style page and save up to five colours. Put the one you want as the accent first.
- Write a short typography line there too. A single clear word is enough: serif, geometric sans, humanist sans, slab.
- Come back to Community → Templates. The line under the Bernard card names the accent it is now using and the typeface family it chose.
Readability comes first
Two checks run before any colour is used, and both can override what you saved.
- If the background you saved would leave your text hard to read against it, Bernard keeps your text colour and puts it on white instead.
- If your accent colour would be too faint to read as a button, Bernard uses its own accent for that one part.
Neither of these is a judgement about your brand. An unreadable web page can be fixed in a minute; an unreadable email has already been delivered.
Asking Bernard to design one
You do not have to fill in a form to get any of this. In Community → Templates, choose Design one with Bernard. Bernard asks two or three questions - what the email is for, roughly what it should say, and anything to avoid - and then writes the whole thing, in your colours, and shows it to you before anything is saved.
See Send the same kind of email without rebuilding it for what a template holds and how to reuse one, and Preview and test my email campaign before I send it for sending yourself a real one to look at in your own inbox.
The prompt
“Design an email template for me that matches my site, then tell me which colours and typeface you used.”
Press Copy, then paste it into your AI and fill in the [bracketed] parts. First time? Connect your AI to bernard first - a one-time setup in bernard → your site → Use your own AI.
Questions people ask
- Do I have to choose colours for my emails?
- No. Bernard reads them from your site. Your saved colours on the Your style page come first; if you have not set any, Bernard uses the colours it counted in your site's own stylesheet; if there are none of those either, it uses a plain black-on-white design that suits any brand.
- Will my email use my website's font?
- Not the exact one. Mail apps draw email with the typefaces already installed on the reader's computer or phone, and a font downloaded from the web is either blocked or ignored by most of them. So Bernard matches the family instead: a serif site gets a serif email, a geometric sans site gets a geometric sans email. It reads as yours; it is not letter-for-letter your web font.
- Where do I change what Bernard matches?
- On your site's Your style page. The colours you save there are the first thing Bernard looks at, and the typography line you write there is how it chooses the typeface family. A change shows on the Templates tab within about a minute.
- Do I have to re-save my old templates to get the new look?
- No. The style is applied when the email is drawn, not when it was saved, so every template and every draft you already have picks it up on its own.
- Bernard used the wrong colour. What happened?
- Bernard picks the strongest colour that is still readable as text on a pale background. If your site's boldest colour is very pale or very dark, it is skipped, because an email nobody can read cannot be taken back once it is sent. Save the colour you want first in the list on Your style.
- Can I still choose a colour myself in one email?
- Yes. A colour you set yourself in the editor is left exactly as you set it. Bernard only paints over its own plain starting colours.
- Does the styling change what I have to approve?
- No. Bernard still shows you the finished email and waits for your approval before a template is saved, and a campaign made from it still needs its own separate send approval with the exact recipient count. The colours are part of what you are approving, not something applied afterwards.
- Does my logo go in the email?
- No. Audience email carries your name in your accent colour and no logo. It keeps the message light, keeps it out of the clipped view Gmail shows on long mail, and keeps it looking like a note from a person rather than a mailshot.