Prime One Figma Kit customization

[kedXD]

I purchased the license of Prime One Figma Kit, I need to know is there is any best practice / guidelines to customize the UI kit:

1. I already have a set of colors based on the corporate branding. So, need to use those in place of the ones provided in the Prime One Figma Kit. If I want to replace my colors and shades of blue, red, orange, gray, green etc. what would be the best way to achieve this, knowing that these colors are all mapped to many other components.
2. If I just go ahead and use my own sets of colors and shades, what would be the impact when there will be future release of Prime Figma Kit?
3. Is 'Token Studio' capable of generating color palette that I can replace with the existing color palettes of blue, green etc? I tried the free version of Token Studio but wasn't able to replace my sets of blue color palette with Prime One blue palette.

Thank you.

[onursenture]

The best place to look for Best Practices and Guidelines is the sections on the UI Kit file's Getting Started page. We plan to create short YouTube tutorials on these topics soon. Let me briefly answer your questions:

The best way to change colors for your corporate branding is to use the design tokens we've created in Tokens Studio. By changing the primary tokens under the Semantic Set, you can apply your brand colors wherever they are used.

If you want to change surface tokens, these are located in the Semantic/Light and Semantic/Dark sets.

Changes made can be disrupted with each update. The recommended best practice is to make changes not directly on PrimeOne but on a higher-level design system that wraps PrimeOne. This way, you have more control over any breaking changes in PrimeOne and your customizations. Additionally, I recommend documenting everything you do.

Tokens Studio's "Color Scale Generation" is not in the plugin itself but is available in the Graph Engine project, which is still in beta and hasn't been tested by us yet. I can't provide details as I haven't tried it, but you can check it out via this link: Graph Engine

[kedXD]

I changed the primary color (emerald) to my own set of colors using Token studio, though the changes get reflected in the file the variables remain unchanged. So, my primary color is customized blue now, but the variable palette still shows the default Prime One primary colors. It's very confusing and also the changes take so much of time to reflect, it kind of slows me down every time I make any changes.
The best practices/guidelines are superficial and hardly helps. More elaborate help system or guides or tutorial videos are a must for these kind of UI kits.
I thought buying a pre-defined UI kit will save time and efforts, but now it takes even more time and lot of effort to customize and on top of it, there is a risk of changes made in local might get broken or disrupted with every upgrade? Thats not good.
I wish there were more transparent information before one makes a decision to buy the kit.

[ndupasquier]

I'm experiencing the same issues, very very long to custom via token studio, change are not reflected in figma variable which is confusing.
To update variable in figma, I guess you have to click "styles and variables" and export styles and variables but when i do this, it creates like 4000 new variable whereas variable already exist in the figma file. I don't understand why.

[ndupasquier]

Changes made can be disrupted with each update. The recommended best practice is to make changes not directly on PrimeOne but on a higher-level design system that wraps PrimeOne.

Can you say more about this idea to wrap primeOne on an higher-leve design system ? PrimeOne is such a huge kit, it's take so much time to make change on colors and apply it. It's hard to browse the file so the idea to wrap PrimeOne can be interesting.