Implementing User-Toggleable Light/Dark Modes in Constellation 25.1

User Experience
1

Hi Team,

I am currently working with Pega Constellation 25.1 and have a requirement to enable a user-controlled Light/Dark theme toggle at runtime.

Since Constellation uses Design Tokens and App Studio usually only allows one active theme per portal, I’m looking for the best way to handle this.

  1. Is there a built-in way in 25.1 to support “prefers-color-scheme” (system dark mode)?

  2. If not, what is the recommended approach for a user-controlled toggle? Should I use a Custom DX Component in the header to swap CSS variables?

  3. Where is the best place to save the user’s theme preference (Operator record or a Data Page)?

Looking forward to your advice and any best practices!

2

@hemalathag8810 There is no such way OOTB currently. Building a DX component is certainly an option. But our product team is also looking at implementing this natively into the platform, no promises made - but could be an idea to weigh the implementation cost of adding a DX component vs waiting for native support.

2 Likes