Conversation
Virtusa
SG
Last activity: 27 Jan 2026 21:39 EST
Guidance: How to set different CSS for Labels vs Fields in Constellation
Summary
We need a clean way to style labels differently from input fields (e.g., font-weight, color, spacing) while staying within Constellation best practices.
What we attempted
- Updated theme typography tokens (global) – this applies broadly but does not clearly differentiate labels vs fields.
Desired Outcome
- Labels: e.g., medium weight, brand color, smaller size.
- Fields: e.g., regular weight, neutral color, base size.
- Approach should be upgrade-safe, token-driven where possible.
Request from Support
- Confirm the recommended token mappings (e.g., specific tokens for label text vs input text) and whether Constellation exposes distinct CSS variables/selectors for these.
- Provide sample selectors or token names that are safe to override
Pegasystems Inc.
GB
@Gaurav25The User Experience Expert Circle is not Pega Support, it is a collaborative community of Pega practitioners.If you need to raise a ticket with on My Pega Support, please do so.
Did you find a resolution to this that you can share?
Best practice would be to stay within Pega's theme tooling in App Studio, this has been enhanced in Infinity '25 to provide even more configurations. It also has built in accessibility guidance for when you start clashing on colour pallete. IF I understand your question correctly, then you can modify this as below.
If you are going the design token route, you might find this documentation handy. It has all the tokens we have, including some custom ones that aren't standard CSS tokens. Though I can only find 3 entries for labels, so the nuance you are after might not be there.
- https://docs.pega.com/bundle/platform/page/platform/user-experience/des…
- https://docs.pega.com/bundle/platform/page/platform/user-experience/des…
@Gaurav25The User Experience Expert Circle is not Pega Support, it is a collaborative community of Pega practitioners.If you need to raise a ticket with on My Pega Support, please do so.
Did you find a resolution to this that you can share?
Best practice would be to stay within Pega's theme tooling in App Studio, this has been enhanced in Infinity '25 to provide even more configurations. It also has built in accessibility guidance for when you start clashing on colour pallete. IF I understand your question correctly, then you can modify this as below.
If you are going the design token route, you might find this documentation handy. It has all the tokens we have, including some custom ones that aren't standard CSS tokens. Though I can only find 3 entries for labels, so the nuance you are after might not be there.
- https://docs.pega.com/bundle/platform/page/platform/user-experience/des…
- https://docs.pega.com/bundle/platform/page/platform/user-experience/des…
Be cautious, this is advanced tooling, as I said best practice would be to use Themes.
Virtusa
SG
Hi @MarcCheong, Yes I am looking for the same in the Pega App Studio the only option is to change Color however we are looking for font-weight option.
Labels to be defined as: font-weight-bold, Text: as: font-weight-regular.