Change elements styling

[Dinaaaaaaa-tr]

Hi there! I’m a designer currently exploring the PrimeNG UI Kit, and I have a couple of questions about customizing the components for design purposes in Figma and how that translates into the development workflow.
My main questions are:

1. Is it possible for a designer to alter token variables (such as colors, fonts, borders, spacing, etc.) within the PrimeNG UI Kit after receiving it?
   For example, if I need to adjust brand colors, font families, or border-radius values globally across all components, can these be modified directly in the Figma UI Kit?
   Are there specific token variables or styles that are locked or difficult to modify in the UI Kit?

2. To what extent can I customize the styling of individual components after receiving the PrimeNG UI Kit in Figma?
   Can I modify all aspects of a component’s styling, such as:

• Colors (background, text, borders)
• Typography (font family, size, weight)
• Borders (width, radius, style)
• Shadows (elevation, blur, spread)
• Spacing (margins, paddings)
• States (hover, active, disabled, etc.)
  Will these changes apply globally across all relevant components, or do I need to adjust each instance manually?

Any insights would be greatly appreciated!
Thank you in advance

[onursenture]

Hello, yes, you can modify all tokens as you wish. However, please keep the following in mind:

Semantic and primary tokens are widely used throughout the system for various purposes. Be aware that changes to these tokens may impact components beyond those you intend to modify.

While the new token system is more secure against breaking changes, it's still a relatively new theming approach. Future updates to the code and UI kit might introduce breaking changes. Therefore, we recommend documenting your changes. This way, you'll have a reference if you need to reapply them in the future.

In summary, you can change everything from a styling point of view. Just be mindful of how you make these changes and ensure you document them.