Managing Custom Brand Colors in Cal ID

In Cal ID, set primary colors for your booking page so it matches your visual identity — with separate colors for light and dark themes.


Set your brand colors


  1. Log in to Cal ID.
  2. Click the Settings icon in the sidebar.
  3. Open the Custom Branding tab.
  4. Scroll to Custom brand colors and switch the toggle ON.



  1. Light theme: click Brand color (light theme) and enter a hex code or use the picker.



  1. Dark theme: click Brand color (dark theme) and choose the color for dark mode.



  1. Click Update to apply.


Tip: pick colors that stay readable in each theme — a darker shade for light mode, a brighter one for dark mode.


What changes on your page


  • Buttons: primary actions (like "Confirm") use your brand color.
  • Highlights: selected dates and active time slots are highlighted in your color.
  • Navigation: progress bars and some icons adopt your scheme.




💡 Tip


For accessibility, avoid very pale colors (white, light yellow) as your primary — they're hard to read on light backgrounds. Aim for strong contrast so buttons stay easy to see.

Updated on: 04/08/2026

Was this article helpful?

Share your feedback

Cancel

Thank you!