Skip to main content
Set specific primary colors for your booking page so it matches your company’s visual identity. You can define different colors for light and dark themes, giving your page a custom, polished feel regardless of your guest’s system settings.

​
Step-by-step setup

1

Log in to Cal ID

Sign in to your account.
2

Navigate to Settings

Click the Settings icon in the sidebar.
3

Go to Custom Branding

Select the Custom Branding tab.
4

Enable the feature

Scroll to Custom brand colors and switch the section toggle to ON.
Enable custom brand colors
5

Set the light theme color

Click on the Brand color (light theme) field, then enter your brand’s Hex code or use the color picker to select the primary color for light mode.
Set light theme brand color
6

Set the dark theme color

Click on the Brand color (dark theme) field, then select the color that will represent your brand when a guest views your page in dark mode.
Set dark theme brand color
7

Save your changes

Click the blue Update button at the bottom of the section to apply these colors to your public booking page.
Choose colors that remain readable in their respective themes—for example, a darker shade for light mode and a slightly brighter or more vibrant shade for dark mode.

​
What this changes on your page

Once saved, your custom colors will override the default Cal ID branding in several key areas:
  • Buttons: Your primary action buttons (like “Confirm”) will use your selected brand color.
  • Highlights: Selected dates and active time slots in the calendar will be highlighted in your brand color.
  • Navigation elements: Progress bars and specific icons will adopt your custom color scheme.
Brand colors applied to booking page
Brand colors applied in dark mode
To ensure accessibility, avoid using very pale colors (like white or light yellow) as your primary brand color, as they can be difficult to read on light backgrounds. Aim for a contrast ratio that makes your buttons easy to see for all users.

​
Next steps

Team brand colors

Apply the same color controls to a team’s booking page.

Custom Branding overview

Add a banner, social profiles, and a logo to complete your page.

Related topics

Managing Custom Brand Colors in Cal ID for TeamCustom Branding For PersonalCustomize Your Brand Logo and Favicon in Cal IDCustomizing Your Appearance in Cal ID