Setting Themes for Branding in CloudRadial UCP

Overview

Themes control the visual appearance of the CloudRadial Unified Client Portal (UCP) — the base look and feel, whether the portal opens light or dark, and the brand colors applied on top. Themes can be set at three levels: the partner level, per client, and per user.

Company settings override the partner default, and a user's own choice overrides the company default when you allow it. If a level is left unset, it inherits from the level above.

• Setting the Base Theme and Default Mode
• Setting Your Brand Colors
• The Home Page
• Setting a Company Theme
• User Experience: Choosing a Personal Theme
• Checking Your Work
• If You Are on a Legacy Theme

Setting the Base Theme and Default Mode

Before you start, if this is a new portal: fill in the Contact tab first. Your mailing address, website URL and phone number are required, and they appear in the transactional emails the portal sends on your behalf. They are not decoration, and filling them in after you have invited people means your earliest emails go out incomplete.

1. Go to Partner > Settings > Account & Branding.
2. Select the Branding tab.
3. The Theme section is at the top.

Base Theme is the theme applied to your users. CloudRadial Fluent is the current theme; every other entry in the list is a legacy theme. See About the CloudRadial Fluent Theme for what the difference amounts to.

Choosing CloudRadial Fluent changes two other settings for you. It sets Default Mode to Light, and it turns on Allow users to choose their own theme. Both are ordinary settings you can change straight away — but if you want every user locked to one appearance, clear the checkbox before you save.

Default Mode sets whether the portal opens in Light, Dark or System. System follows each user's device light/dark setting, or the Microsoft Teams theme when the portal is open inside Teams.

Allow users to choose their own theme (System / Light / Dark) lets individual users override the default mode from their own profile. Leave it clear to lock everyone to the mode you set.

Save when you are finished. These settings apply to every client that has not set its own override.

Setting Your Brand Colors

Below the Theme section, branding is grouped by the surface it affects rather than by field type. Each group has a Light Mode column and a Dark Mode column, so you can see at a glance what a user gets in either mode.

There are two color groups:

• Title Bar > Bar Color — the bar across the top of the portal
• Buttons & Links > Primary Color — buttons, links, selected items and other interactive accents

Each color field is a live preview tile, not a swatch. Click it to open the color picker, and the tile repaints as you drag:

• The Bar Color tiles show your real title bar, with your own logo composited onto it, so you can see immediately whether the logo still reads against the color you are choosing.
• The Primary Color tiles show a real button and a real link on the real portal background for that mode.

Leaving a field blank means "use the theme default" — it does not mean black. A blank tile paints the default and says so. The defaults are:

You only have to fill in the light column. The dark fields are overrides. If you leave the dark Bar Color blank, your light bar color is used in dark mode exactly as you set it — your brand color is not darkened behind your back. If you leave the dark Primary Color blank, your light primary is brightened for dark mode so that a deep brand color does not vanish against a dark background.

Fill in a dark value when you want to decide that yourself rather than accept the automatic result. Use the clear control on a dark field to go back to inheriting.

Note: The Bar Color for light mode cannot be cleared — every portal has a title bar color, and clearing it would leave nothing to draw. Set it to #22335a if you want the CloudRadial navy back.

The Home Page

The Home Page group holds the logo shown at the top of the portal home page, and it has both a Light Mode and a Dark Mode slot.

This is the one place a second image is genuinely necessary. Your title bar color does not change between modes, so the logo on it stays readable either way — but the home page background flips from near-white to near-black, and a logo drawn in a single ink color will disappear in one of the two.

Each slot previews on the real portal background for that mode, so you can see the problem before your clients do.

The dark Home Logo applies to CloudRadial Fluent only. On a legacy theme the portal always shows the light Home Logo, whether or not a dark one has been uploaded. If you are preparing to move to Fluent, you can upload it in advance — it simply does nothing until you switch.

The Welcome Message in the same group accepts CloudRadial tokens and applies to both modes. Leave it blank for the default message.

For the full picture of which image appears where — including the two title-bar logos, favicons, email and login images — see Logos and Images Across the Portal.

Setting a Company Theme

You can override the theme for a single client so that company sees a different look from your other clients:

1. Go to Partner > Clients.
2. Open the client and select Edit.
3. Select the Branding tab.
4. Turn on Apply custom branding for this company? if it is not already on.
5. Set the theme options for that client.

The client-level panel is the same panel, with the same surface groups and the same preview tiles. The only difference is the Base Theme list, which drops the "Partner Set -" wording because at this level every entry is a company setting.

If a company has no override, it follows the partner-level settings. See About Client-Level Branding.

User Experience: Choosing a Personal Theme

When Allow users to choose their own theme is on, each user can set their own appearance:

1. Click the profile button at the top right of the portal.
2. Open the Appearance tab.
3. Choose System, Light or Dark.
4. Click Submit.

System follows the user's device light/dark setting, or the Teams theme when the portal is open inside Teams. A user on System sees the portal change when their device changes, without reloading.

If user theme choice is off, the Appearance tab is not shown at all and users see the mode you set.

On a legacy base theme this tab is different. It is labeled Theme rather than Appearance, and it offers the legacy theme list instead of Light/Dark/System.

Checking Your Work

When you have set the colors and uploaded the logos, sign in as yourself and spend five minutes with the finished portal. Use the Appearance tab in your own profile to switch between Light and Dark, and check three things:

• The home page in dark mode. This is where a logo drawn in a single ink color disappears.
• The title bar in both modes. Same color, same logo — confirm the logo still reads in each.
• A button and a link. If your brand color looks muddy in dark mode, set an explicit dark Primary Color rather than leaving it to the automatic result.

If You Are on a Legacy Theme

The Branding tab looks different on a legacy theme: colors are a single Brand Colors group with one Title Bar Color field, logos are a flat Logos list, and there is no light/dark split anywhere, because a legacy theme has only one appearance.

Legacy themes still work and are still supported. They are not being developed further, and the features above — dark mode, per-user appearance choice, the primary brand color, the dark Home Logo — are not available on them. Moving from a Legacy Theme to CloudRadial Fluent covers what changes when you switch.

Related

• About the CloudRadial Fluent Theme — what Fluent is and what it gives your users
• Logos and Images Across the Portal — which image slot drives which surface
• Moving from a Legacy Theme to CloudRadial Fluent — the migration
• About Client-Level Branding
• Setting the Client Portal Favicons

If you are still having trouble, we're here to help!

Submit a ticket here for assistance, and don't forget to check our status page to ensure there are no outages in your area.