Custom CSS

You can apply custom CSS to your online ordering store to match your brand’s look and feel beyond the standard branding options.

Where to add CSS

Custom CSS is added in the Appearance section of your store settings. Changes are applied immediately to your live store, so we recommend testing in a staging environment first.

Common customisations

Colours

Override the primary brand colour and button styles:

:root {
  --color-primary: #e63946;
  --color-primary-dark: #c1121f;
}

Typography

Change the font family used across your store:

body {
  font-family: 'Georgia', serif;
}

Buttons

Customise the shape and style of call-to-action buttons:

.btn-primary {
  border-radius: 2px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

Scope

Custom CSS applies to your online ordering store only. It does not affect email templates or the loyalty app.