Ui builder css variables
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
04-03-2025 12:24 AM
Hi
In ServiceNow ui builder there are css variables defined if we want to modify those it's not allowing me to do.
i want to change those where change i change
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
04-03-2025 12:34 AM
are you in correct scope?
this is for which page?
If my response helped please mark it correct and close the thread so that it benefits future readers.
Ankur
✨ Certified Technical Architect || ✨ 9x ServiceNow MVP || ✨ ServiceNow Community Leader
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
04-03-2025 12:37 AM
Hi @Ankur Bawiskar
correct scope and this is ui builder page.
i want use different color but by default in variables color is getting applied i want to change default color so i tried to modify in variables but it's showing can't edit in read only editor .
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
04-03-2025 12:50 AM
check these links
All about Next Experience (Polaris) Themes Part 2 - UX Theme records
Next Experience UI - Understanding Themes
If my response helped please mark it correct and close the thread so that it benefits future readers.
Ankur
✨ Certified Technical Architect || ✨ 9x ServiceNow MVP || ✨ ServiceNow Community Leader
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
04-03-2025 12:39 AM
Hello @Vedavalli
In ServiceNow UI Builder, the CSS variables are defined at the platform level, and modifying them directly is restricted. However, there are ways to override or customize the UI theme:
Override CSS Variables in Theme
ServiceNow defines CSS variables in UI Builder within the Now Design System (NowDS). These are typically found in:
Path: System UI → Themes
Steps to Override CSS Variables:
Go to: System UI → Themes
Find the active theme (e.g., Now Experience Theme).
Clone the theme (You cannot edit the default theme).
Modify CSS Variables under the SCSS Variables Section.
Apply the new theme
Mark helpful if your issue got resolved.
Regards,
Rohan.