Best practice for multiple colours but using the same component

Ask the community
1

Hi, my flow is as follows in my organisation with multiple segments of different colours:

Components library figma file (For designer to edit and push changes to Prototyping Tools below)
↳ Main Prototyping Tool figma file (designer changes the instance colour to blue for client to use)
↳ Segment 1 Protyotyping Tool figma file (designer changes the instance colour to black for client to use)
↳ Segment 2 Protyotyping Tool figma file (designer changes the instance colour to brown for client to use)

By only having 1 generic library (because it’s easier to manage), if client changes the state of a button in Segment 1 or 2, it will pull the original colour from my components library. What is the current best practices for organisations with multiple brands/regions? Thanks!

2

Best practice is to have another variant field that make the color change.
And instead of changing in 1 & 2, the designer would just select the right variant

It’s how it’s done in most librairies (check Untitled UI for example)

It creates bigger components but I don’t see any other way around