Tokens

Design tokens are all the values needed to construct and maintain a design system — spacing, color, typography, object styles, animation, etc.

These can represent anything defined by design: a color as a HEX value, an opacity as a number, an animation ease as Bezier coordinates.

They're used in place of hard-coded values in order to ensure flexibility and unity across all multi-product experiences.

Design tokens are directly integrated into our component libraries. They cover the various options of platform scales, color themes, and more.

How to create your own custom theme based and use it for your product.

• Create your product theme template file .
• Check the guide for colours .
• Replace colour values one by one.
• Change the values to your product ones.
• Publish your changes.
• Share tokens with your product front-end developers.
• Enjoy your new theme! 🎉