---
title: "Add your brand with the design kit"
description: "Set the background, fonts, text colors, links, logo and button style once, and every page of the campaign follows them. Save kits and reuse them in other campaigns."
url: https://scratcher.io/help/campaigns/design-kit
language: en
---

1. [Help center](https://scratcher.io/help)
2. [Campaigns and the editor](https://scratcher.io/help/campaigns)
3. Add your brand with the design kit

# Add your brand with the design kit

Set the background, fonts, text colors, links, logo and button style once, and every page of the campaign follows them. Save kits and reuse them in other campaigns.

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](https://scratcher.io/help/elements/page-settings-and-backgrounds).

## 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](https://scratcher.io/help/elements/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](https://scratcher.io/help/campaigns/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](https://scratcher.io/help/ai/brand-kit-and-ai-themes). You can also ask Rex, for example "Make the buttons orange and rounded". See [Changes Rex can make for you](https://scratcher.io/help/ai/ask-rex-to-make-changes).

## 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.

Campaigns and the editor

- [Create a campaign from a template](https://scratcher.io/help/campaigns/create-a-campaign)
- [Get to know the editor](https://scratcher.io/help/campaigns/editor-overview)
- [Add, reorder and manage pages](https://scratcher.io/help/campaigns/pages-and-flow)
- [Add and edit texts, images and other elements](https://scratcher.io/help/campaigns/add-and-edit-elements)
- [Add your brand with the design kit](https://scratcher.io/help/campaigns/design-kit)
- [Animations, confetti and other effects](https://scratcher.io/help/campaigns/animations-and-effects)
- [Personalise texts with dynamic tags](https://scratcher.io/help/campaigns/dynamic-tags)
- [Publish, schedule, pause and end a campaign](https://scratcher.io/help/campaigns/publish-and-schedule)
- [Preview and test your campaign](https://scratcher.io/help/campaigns/preview-and-test)
- [Editor errors and warnings: what they mean and how to fix them](https://scratcher.io/help/campaigns/editor-errors-and-health-check)
- [Run a campaign health check](https://scratcher.io/help/campaigns/campaign-health-check)
- [Run a campaign in several languages](https://scratcher.io/help/campaigns/languages-and-translation)
- [Organise, copy and delete campaigns](https://scratcher.io/help/campaigns/organise-campaigns)
- [Send emails to players](https://scratcher.io/help/campaigns/send-emails-to-players)
- [Plan your year with the Plan calendar](https://scratcher.io/help/campaigns/plan-your-campaigns)
- [Products and product feeds](https://scratcher.io/help/campaigns/products-and-product-feeds)
- [Good to know about the editor](https://scratcher.io/help/campaigns/editor-good-to-know)

## Related articles

- [Add and edit texts, images and other elements](https://scratcher.io/help/campaigns/add-and-edit-elements): Insert elements, change texts, upload images and fonts, and style everything for desktop and mobile.
- [Page settings, backgrounds and popup pages](https://scratcher.io/help/elements/page-settings-and-backgrounds): Set a page's background, align its content, turn a page into a popup, hide the header and refresh the page automatically.
- [Match your brand from your website, or generate a theme](https://scratcher.io/help/ai/brand-kit-and-ai-themes): Let AI read your website and fill in your design kit, or create a complete theme from a short description.

## Still need help?

Real people are here to help. If you already use Scratcher, the quickest way is the chat inside the platform.

- **[Chat with us](https://platform.scratcher.io/login)**

    Log in and click the chat button in the bottom-right corner. Rex answers right away, and our team is a click away.
- **[Book a meeting](https://scratcher.io/book-a-meeting)**

    A free 30-minute video call with our team: a tour, campaign ideas or help with your setup.
- **[Email us](mailto:contact@scratcher.io)**

    Write to contact@scratcher.io and we will get back to you.