Add your brand with the design kit

The design kit holds the look of your campaign: the background, the fonts and text colors, links, your logo and the button style. Elements follow the design kit unless you style them yourself, so one change in the design kit updates every page of the campaign at once.

Change the design kit of a campaign

1. In the editor, click Designkit under Layout at the top of the left panel, or press Shift+D.
2. Stay on the Edit tab.
3. Open a section: Background, Typography, Link, Logo or Button.
4. Change the settings. The canvas updates right away and your changes are saved automatically.
5. If the campaign is live, click Update to put the new look live.

Each campaign has its own copy of the design kit. Changing it only changes this campaign, never your other campaigns or your saved design kits.

Background

• Background color: the color behind every page.
• Desktop background: an image behind the pages on computers.
• Mobile background: an image for phones.
• Alignment: where the image is anchored, left, center or right, and top, center or bottom. This matters when the image is cropped on narrow or tall screens.

A single page can still have its own background. Use Edit background on that page. See Page settings, backgrounds and popup pages.

Typography

• Default color: the color of all text that has no color of its own.
• Under Typography, pick a text style with the tabs P (Paragraph), H1, H2, H3 and H4 (Heading 1 to Heading 4). For each style you set:
  • the font and size, for example Heading 1 font
  • the size on phones, for example Heading 1 mobile size (optional)
  • the color, for example Heading 1 color
  • Bold and Italic, for example under Heading 1 style

A text uses these styles when you mark it as Paragraph or Heading 1 to Heading 4 in the text toolbar. See Edit text and headings.

Choose a font in the font list (Choose a font - begin typing to search). Fonts you have uploaded are under My Fonts, and you can upload a font from the list too. Make sure you have the right to use a font before you upload it.

Link

Set the Color of links in your texts, and their Style: Bold, Italic and Underlined.

Logo

• Image: upload your logo.
• Size: the logo's width.

The Logo element shows this logo, so you only upload it once. When you change it here, every logo in the campaign changes.

Button

• Font: the font, the text size, and Bold on or off.
• Button: the button's background color.
• Text: the text color.
• Border: None, Solid, Double, Dotted, Dashed or Groove. With a border, set its width and color.
• Size: the Width (or fit text) and Height.
• Shape: Square, Round or Pill.

These settings are used by every button that has no style of its own.

The design kit for emails

When you edit the campaign's emails (Connect > Emails), the design kit's Background section only has the Background color of your emails. The other settings work as for pages. An email's Styles tab has Reset to design kit to go back to this color. See Send emails to players.

Let AI do it for you

At the bottom of the Edit tab:

• Generate brand kit reads your website and fills in your colors, fonts, logo and button style.
• Generate theme makes a complete look from a short description, such as "Black Friday, dark background, bold orange".

Both use AI tokens. See Match your brand from your website, or generate a theme. You can also ask Rex, for example "Make the buttons orange and rounded". See Changes Rex can make for you.

Save a design kit to reuse it

1. When the design kit looks the way you want, click Save as template at the bottom of the panel.
2. Type a Name, such as "Christmas" or "Summer".
3. Click Save. You see "The design kit has been saved as a template."

The saved kit is now under My design kits on the Browse tab in all your campaigns.

Use a saved or ready-made design kit

1. Open the design kit and click the Browse tab.
2. Find a kit under My design kits, or in one of the ready-made groups below it. Use Search design kits to search by name.
3. Click a kit. The canvas shows a preview of the campaign with that kit.
4. Click Choose design kit. Its background, fonts, text styles, link style, logo, button and email background are copied into this campaign, and the panel switches back to Edit.

The kit is copied, not linked. If you later change the saved kit, campaigns that already use it don't change. Likewise, changes you make in a campaign don't change the saved kit.

Rename or delete a saved design kit

On the Browse tab, open the menu (Actions) on one of your own kits:

• Edit opens Edit design kit, where you can change the Name. Click Save.
• Delete asks you to confirm (Delete design kit). Deleting a saved kit doesn't change any campaign that already uses it.

Good to know

• To make one element look different, style it on the element's Styles tab. That element then no longer follows the design kit for that setting.
• The keyboard shortcut Shift+D opens the design kit from anywhere in the editor.