@spectare-personalisation/react
Package
18 and 19
React versions
Yes, via initialAssembly prop
SSR zero-flicker
The React package now accepts an accent prop on ComponentRenderer, PersonalisedSection, and the server renderer. Pass a single hex value and Spectare derives the tint and border colours automatically, so you set one value rather than three separate CSS variables.
Before this change, applying a brand colour required overriding --sp-accent, --sp-accent-bg, and --sp-accent-border in your own stylesheet, and the outcome depended on which stylesheet loaded last. The prop is resolved before any styles are written, so it wins regardless of load order.
The script tag integration follows the same pattern using a data-accent attribute. Add data-accent="#e11d48" to your Spectare script element and every component on that page uses your brand colour without any additional CSS.
Defaults are unchanged on both paths, so existing integrations that do not set an accent see no visual difference and require no code changes.
This is one atom from the Spectare content library. Spectare assembles the right atoms for each visitor in real time, based on who they are and how they arrived.