Choosing a brand font for your website
Alongside your brand colours, you can pick the typeface used on your online ordering website and your branded mobile app. Each option is a pairing — one font for headings and one for body text — chosen so the two work well together. Your logo is not affected. Kiosks always use Inter, which is designed for reading at a distance, so the brand font does not change them.
For everything else you can change about your branding (logo, images, colours and favicon) across your website, app and kiosk, see Make your website, app and kiosk match your brand.
Setting your brand font
- Sign in to Back Office at Company level (no store selected in the store switcher).
- Go to Setup > Online Ordering > Website & App > Settings.
- In the Design & Branding section, scroll to Brand Font, just below Brand Colours.
- Click the pairing you want. Each tile previews a sample heading and a line of body text in that pairing, so you can see how it will look before saving.
- Click Save Changes (top right).
Note: These settings live at Company level because they apply to your whole website, not to an individual store. If Settings is not showing under Website & App, make sure no store is selected in the store switcher at the top of the page.
The available pairings
| Pairing | Best for |
|---|---|
| Inter | Neutral and modern. The default. |
| Poppins / Inter | Geometric and friendly. |
| Montserrat / Open Sans | Confident, wide headings. |
| Nunito | Soft and rounded. |
| Oswald / Roboto | Tall and condensed. |
| Playfair Display / Lato | Elegant serif headings. |
| DM Sans | Low-contrast and calm. |
| Fraunces / Inter | Characterful display serif. |
| Bebas Neue / Roboto | Bold, all-caps impact. |
| Lora / Source Sans 3 | Classic, readable serif. |
If you have never changed this setting, your website uses Inter, so nothing changes until you choose something else.
If you run more than one brand
Your brand font is set per brand, in the same place as your brand colours. If you use Virtual Brands, choose the brand in the Virtual Brand selector at the top of the Settings page before choosing a font, so each brand can have its own.
Troubleshooting
- My app still shows the old font. Close and reopen the app once more. The app downloads the new font the first time it opens and shows it from the next start.
- My website still shows the old font. Check you clicked Save Changes, then reload your website with a hard refresh (Ctrl+F5 on Windows, Cmd+Shift+R on a Mac). Browsers cache fonts for a while.
- I changed the font but only one brand updated. The font is set per brand. Switch brand with the Virtual Brand selector at the top of the Settings page and set it again for each brand you run.
- I want to use my own font file. Custom font uploads are not supported. The list above is curated so that every option loads quickly on mobile and is licensed for use on your site.