Selecting new theme colors for your network

May 18, 2026 09:52

Article Summary

This guide explains how to use the Branding settings in Speakap to customize the network's appearance with corporate logos, colors, and backgrounds. It covers how to create multiple themes for different brands or markets, configure visual elements across various tabs, and the strict rules for assigning these themes exclusively to Business Units (BUs) or the Network as a whole.

1. Understanding Themes and Branding

Speakap allows administrators to customize the platform's branding to create a familiar and secure environment for employees.

If a company operates multiple brands or serves different markets, a single network-wide design may not be sufficient. To solve this, administrators can create multiple themes and assign them to specific Business Units (BUs), ensuring employees see the branding most relevant to them.

2. Accessing Branding Settings

To manage your network's visual appearance:

Navigate to Network settings.
Select the Appearance section.
From this menu, you can search, edit, delete, or create new themes.

4. Creating and Configuring a New Theme

To build a new theme, click the New theme button in the Branding settings. This opens a configuration window divided into several tabs. Click Save at any time to preserve your progress.

Tab: General

Theme name: The unique identifier for the theme in the Branding menu. This field is mandatory.
Network avatar: The primary logo displayed on the login screen and within the network interface.
Favicon: The small icon displayed in web browser tabs and bookmarks.
Network logo: The logo shown on the left top in the main banner

Tab: Colors

Primary Color

The primary color will be the more prominent in elements all across the platform. Different shades of this color can be applied in various ways.

Where is it applied?

The primary color is typically used for things like buttons, and key call-to-action elements.

Note that this color will also appear on mobile on the selected feed filter button.

It might be helpful to think of the primary color as what you know selected for button links and more and the secondary color as what you know as the header color.

To generate the shades, you can use this program. The example below shows the correct parameters for generating the colors.

Secondary Color

The secondary color complements the primary color and provides variety and contrast.

The secondary color creates a balanced design, offering contrast without competing with the primary color. It gives the interface a dynamic look while still maintaining brand cohesion.

Where is it applied?

It only appears in the header.

It might be helpful to think of the secondary color as what you know as the header color and the primary color as what you know selected for button links and more.

Note: at the top, you will see the option to toggle between the Original settings and the Redesign settings. This is because it will be possible to switch between the two for the initial period as both versions will be supported for a time.

Please note: While we update to the new design, some parts of the platform will still look like the old version for a little while. Because of this, we’ll need to keep both the old and new colors working until everything has been fully updated.

Tertiary Color

The tertiary color will be useful to identify clickable elements in your platform's text.

Where is it applied?

It is used for hyperlinks, mentions, and some secondary buttons.

Tab: Background and Banners

Timeline banner: Administrators can upload a custom image. The recommended minimum size is 1280 x 250 pixels for optimal screen resolution. After uploading you can ‘crop’ the correct area.
News banner: Administrators can upload a custom image. The recommended minimum size is 1280 x 250 pixels for optimal screen resolution. After uploading you can ‘crop’ the correct area.
Reset to system defaults: Removes the custom image and restores the default gray background. (tip: scroll down to see it)

Tab: Login

Login Backgrounds: Administrators can upload up to four custom backgrounds specifically for the login page, rotating them for users. If you upload 1 there will not be a rotation. The recommended minimum size is 1440 x 900 pixels (or a 16:10 aspect ratio).
Important Login Constraint: Because the platform cannot identify which specific Business Unit a user belongs to before they log in, the login page will always display the Default Network Theme, regardless of custom BU assignments. In custom themes the Login tab will not be available, only in the Default.

Tab: Covers

Default Cover Image: A custom fallback image used for groups, user profiles, news items, or events that do not have their own specific cover uploaded. This way you have a good fallback option if the creator of content does not add a cover image.
Dimensions: The minimum required size is 1200 x 400 pixels.

5. Rules for Assigning Themes

The Assign theme tab allows administrators to link a completed theme to a specific audience, being 1 or multiple Business Units.

Tab: Preview

The Preview tab allows administrators to see the design they created in a quick preview, before enabling the theme for Users.

Basic Assignment Restrictions:

Allowed Levels: Themes can only be assigned to the Network as a whole (being the default theme), or to specific Business Units (BUs).
Restricted Levels: Themes cannot be assigned to Local Departments (LDs) or any other organizational sub-groups.
One theme per BU: A single Business Unit cannot have multiple themes. Assigning a new theme to a BU will overwrite the existing one.

User View Logic & Conflict Resolution:

Because a user can belong to multiple Business Units, Speakap enforces strict logic to determine which theme they ultimately see.

Condition	Resulting Theme Displayed to User
User is in only one BU, AND that BU has a Custom Theme.	The Custom Theme.
User is in multiple BUs, AND only one BU has a Custom Theme (the rest use the default).	That single Custom Theme.
User is in multiple BUs, AND two or more BUs have different Custom Themes.	The Default Network Theme.
User is in one or more BUs, AND none of the BUs have a Custom Theme.	The Default Network Theme.

Understanding Conflicts

A visual "conflict" only occurs when a user is a member of multiple Business Units, and more than one of those BUs has a different custom theme assigned. In this scenario, the system cannot decide which custom theme takes priority, so it automatically falls back to the Default Network Theme.

Conflict Example: User is in BU A (Theme X) and BU B (Theme Y). The user sees the Default Network Theme.
No Conflict Example: User is in BU A (Theme X) and BU B (Default Theme). The user sees Theme X.

6. Managing Existing Themes

Administrators with Branding access can perform the following actions on existing themes:

Duplicate theme: Creates an exact copy of a theme's visual settings (colors, logos, backgrounds). It does not copy the assigned Business Units. The duplicated theme must be given a unique name.
Edit theme: Allows administrators to change properties on an active theme. Once saved, changes are immediately visible to all users assigned to that theme.

Delete theme: Permanently removes a theme. If the deleted theme is currently assigned to active Business Units, the administrator must reassign those BUs to a new theme or let them fall back to the default.