Brand kit

The brand kit holds what every email should share, so your emails look like your product without restyling each one. Open Mail → Brand kit. It has four parts: Brand, Palettes, Reusable blocks and Folders. Changes are saved for the whole environment. New templates, the prebuilt designs and Compose all start from the brand kit. A template can still change its own styles; the kit is the starting point, not a lock.

Brand

Setting	What it does
Name	Your brand’s name, used in headers and signatures (Northwind)
Logo	An image address (`https://…/logo.png`), or Upload a file. Used at the top of headers. Use a PNG or JPG, not SVG: many mail clients don’t show SVG.
Postal address	Shown in footers. Many countries require one in marketing mail.
Font	The typeface for text and headings (see below)
Width	How wide the email’s content is: Narrow (520px), Standard (600px) or Wide (680px). 600px suits nearly every inbox.
Corners	How rounded buttons, images and panels are, from 0 (square) to 24px
Colours	The colours below

A Brand preview shows how an email looks with your choices as you change them.

Colours

Colour	Used for
Buttons	Button backgrounds
Button text	Text on buttons
Text	Body text
Headings	Titles
Links	Links in text
Email background	Behind the content
Page background	Around the content, the rest of the window
Lines	Dividers and borders

Keep at least 4.5:1 contrast between text and its background. The template checks warn when buttons, text or links are hard to read.

Fonts

Font	Notes
Inter, DM Sans, Plus Jakarta Sans, Lora, Merriweather	Web fonts. Apple Mail and most phone apps show them; Gmail and Outlook for Windows show a similar fallback font instead.
System	Each device’s own interface font. Looks native everywhere.
Helvetica, Georgia, Verdana, Trebuchet, Courier	Installed almost everywhere, so they look the same in every client.

Every font has fallbacks, so an email always reads well even where its font isn’t available.

Palettes

Palettes are extra sets of colours the editor offers next to every colour field, for seasonal campaigns, a sub-brand or a product line. Add palette, name it, and Add a colour. Your brand colours are always offered too, so you don’t need a palette for them.

Reusable blocks

Reusable blocks are pieces you insert into any template: headers, footers, signatures, and any block you save from the editor.

Kind	Typical content
Header	Your logo or name at the top
Footer	A divider, your address and a small line of text
Signature	”Thanks,” and The Northwind team
Block	Anything else: a promo panel, a help box, a legal notice

Make one here (Add a header, footer or signature built from your brand, then edit it), or in the template editor select any block and choose Save as a reusable block. Insert a reusable block from the editor’s Insert menu or by typing / in a template.

Folders

Folders group templates in the library, for example Onboarding, Billing, Marketing. Add a folder by typing its name and pressing Enter. Move a template into a folder from its actions or its details. Removing a folder leaves its templates where they are: they just stop being in a folder.

From code

The brand kit is a single document per environment, readable and writable with a secret key:

import { manage } from "@pawabase/client/manage";

const m = manage(pawabase);
const kit = await m.mail.kit();                  // { brand, palettes, blocks, folders }
await m.mail.saveKit({ ...kit, folders: [...kit.folders, "Billing"] });

kit = pb.manage.mail.kit()
pb.manage.mail.save_kit(brand=kit["brand"], palettes=kit["palettes"], blocks=kit["blocks"], folders=[*kit["folders"], "Billing"])

Saving replaces the whole kit, so read it first and send everything back, as above.

Per environment

Each environment has its own brand kit. Set it up in development, then repeat it in production, or copy it with the management client as above.

Good practice

Use a hosted PNG logo about twice the size it’s shown (for example 240px wide, shown at 120px) so it’s sharp on high-resolution screens.
Keep your postal address filled in, since footers use it.
Make the footer a reusable block so a change of address is one edit.
Stick to one font, two at most.

Getting started

Templates

Send and track

Production

Brand

Colours

Fonts

Palettes

Reusable blocks

Folders

From code

Per environment

Good practice

​Brand

​Colours

​Fonts

​Palettes

​Reusable blocks

​Folders

​From code

​Per environment

​Good practice

Brand

Colours

Fonts

Palettes

Reusable blocks

Folders

From code

Per environment

Good practice