Got the solution from servicenow side
When Enhanced Chat is enabled on a Service Portal, modifying the theming CSS variables described in the Now Assist full‑page theming documentation does not affect the FAB icon colors. The variables are ignored, leaving the default gradient background and FAB colors unchanged, which prevents customers from customizing the chat appearance as intended.
Workaround
1. Open the Service Portal record that hosts the Enhanced Chat.
2. In the **CSS Variables** field, add the following definitions, replacing **#0000FF** with the desired color value:
```css
now-assist-full-page-wrapper-app {
--now-actionable--primary-ai--background-color-gradient--start:
#0000FF;
--now-actionable--primary-ai--background-color-gradient--end:
#0000FF;
--now-assist-selfservice_FAB_hover_color_1: #0000FF;
--now-assist-selfservice_FAB_active_color_1: #0000FF;
}
```
3. If a gradient is not required, set the same color for both
`--now-actionable--primary-ai--background-color-gradient--start`
and
`--now-actionable--primary-ai--background-color-gradient--end`.
4. If want to customize the sparkle icon color inside the FAB, please include: --now-assist-selfservice_FAB_icon_color: #desired-color-HEX-value in above css block
5. Save the portal record and refresh the page; the FAB colors now reflect the specified values.
Thanks,
Naman
