Last Updated: 29 Jan 2024 11:10 by ADMIN
Created on: 26 Jan 2024 18:08
Type: Feature Request
Convert ThemeBuilder variables as CSS custom properties when exporting the theme as a CSS file


I know it is possible to access these variables in SCSS given the right setup. However users might not always be in position to have that, for various reasons, e.g.:

  • a person that doesn't have the time to setup that
  • a person that doesn't want to setup that
  • a person that doesn't know how to setup that
  • a person that isn't authorized to setup that and has access only to the final CSS file

I think it would be nice to make ThemeBuilder available as CSS custom properties (aka "CSS variables"). Some info about this idea (I guess ThemeBuilder uses SASS behind the scenes?): Convert Sass variables to CSS variables · Issue #3091 · sass/sass (github.com)

Regarding the possibly large amount of variables, I think the ones visible in ThemeBuilder would cover the vast majority of cases.

Whether you intend on doing this or not, could you please document how the exported CSS file is generated behind the scenes? I tried reverse-engineering it since I originally wanted to be able to work on SASS code and then obtain the same result as ThemeBuilder. My guess:

  1. SASS generates a minified CSS file (with a sourcemap)
  2. minified CSS then go through Autoprefixer (PostCSS plugin)
  3. minified and autoprefixed CSS then go through calc (PostCSS plugin)


1 comment
Nick Iliev
Posted on: 29 Jan 2024 11:10

Hello Fabien,


Thank you for your feedback and for suggesting a new feature!

Please note that, at present, CSS variables are available in the Fluent theme.

The other Kendo themes, including Bootstrap, are not designed to support CSS variables. However, the Kendo team is currently exploring the possibility of adding CSS variable support to other Kendo themes such as Default and Bootstrap. Currently, the feature is still being researched and we cannot provide a specific timeline for when this support will be introduced. Once CSS variable support is added to Kendo themes, the ThemeBuilder team will quickly integrate this support for CSS variables into the ThemeBuilder application.


Nick Iliev
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.