Maping design tokens to Kendo and publishing project

1 Answer 26 Views
Styling / Themes
julian
Top achievements
Rank 1
Iron
julian asked on 28 Jun 2024, 07:39 PM
How can I integrate our internal design token repository with Telerik Kendo UI to create a custom theme and publish it as a project?

1 Answer, 1 is accepted

Sort by
0
Nick Iliev
Telerik team
answered on 01 Jul 2024, 07:36 AM

Hello Julian,

 

I am Nick Iliev, representing the ThemeBuilder team. In response to your inquiry, we believe that the ThemeBuilder application, along with its ThemeBuilder plugin for Figma, could be a great fit for your needs.

ThemeBuilder is a web-based application that allows you to customize a chosen Kendo theme (such as Kendo Bootstrap, Kendo Material, Kendo Default, etc.) and generate CSS/SCSS files to use in your project.

The ThemeBuilder plugin for Figma lets you export your Figma styles, variables, and icon fonts to the ThemeBuilder project. After that, you can use the imported Figma variables within the Kendo theme by mapping them to existing Kendo or custom variables or directly using them within a targeted component's properties.

If you are interested, you can test the ThemeBuilder application by using the trial version. The trial also provides access to the ThemeBuilder plugin for Figma, allowing you to evaluate its suitability for your needs. Feel free to reach out to us should you have any further questions or need more information.

 

Regards,
Nick Iliev
Progress Telerik

Stay tuned by visiting our public roadmap and feedback portal pages! Or perhaps, if you are new to our Kendo family, check out our getting started resources!

julian
Top achievements
Rank 1
Iron
commented on 01 Jul 2024, 01:12 PM | edited

The source of truth is our design tokens repo, how do we sync our design tokens repo to a Kendo theme?
Nick Iliev
Telerik team
commented on 01 Jul 2024, 02:17 PM

Hey Julian,

 

We do not support automatic import from custom token files - the ThemeBuilder application supports imports only from Figma. So that said, with ThemeBuilder, you can generate a custom Kendo theme, but you will need to map your tokens to a ThemeBuilder token manually.

Alternatively, you can check if there is a third-party Figma plugin to import your custom design token repository to Figma. If applicable, you can use the ThemeBuilder plugin for Figma to import the tokens from Figma to ThemeBuilder, map them to the targeted Kendo variables, and generate the custom Kendo theme.

Tags
Styling / Themes
Asked by
julian
Top achievements
Rank 1
Iron
Answers by
Nick Iliev
Telerik team
Share this question
or