How can I efficiently update components in an existing design system to reflect a new library's styles, such as colors, fonts, and shapes? I'm looking for a plugin recommendation that allows me to quickly select and apply new styles across the design syst

Ask the community
1

It’s a bit complicated to explain, but the components are built using text, color, and shapes. I need to update them with a new color scheme and text theme. The design system is quite extensive, and adapting it to these new styles is necessary. What steps should I take to make this update efficiently?

2

I think you have a few options here, aside from there possibly being a plugin to help with this.

I suggest moving any colour tokens to variables and using the variable mode feature to shift between or, possibly structure the design system slightly to reference other libraries for text and colour styles rather than have everything baked into one file.

This is quite a large task depending on the complexity of your design system, but if it wasn’t structured to accommodate different brands initially, making it work without some refactoring may be challenging.

1 Like
3

First of all thank you very much for your help.

Yes I have been trying a couple of plugins but they haven’t worked correctly as the problem I have is that the old DS components are not correctly linked with the color/text libraries, I think it’s going to be a challenge and I’m going to have to do almost everything one by one changing everything manually.