New to Telerik ReportingStart a free 30-day trial

Migrating Kendo UI from Less to Sass-Based Themes in the HTML5 Report Viewers

Environment

ProductProgress® Telerik® Reporting
Version19.1.25.521 and later

Description

Starting with version 19.1.25.521, the HTML5-based report viewers have undergone major refactoring to become compatible with the newest Sass-based Kendo UI themes. If your application still references Less-based Kendo UI themes after an upgrade, consider migrating to their Sass-based equivalents to ensure the viewers continue to render correctly.

Solution

Step 1: Check Whether You Are Using a Less-Based Theme

Less-based Kendo UI themes are identified by multiple CSS file references that follow this naming pattern:

  • kendo.common.min.css
  • kendo.[theme-name].min.css
  • kendo.mobile.min.css

If you use a single CSS file such as kendo.default-ocean-blue.min.css, you are already on a Sass-based theme and no migration is required.

For more details, refer to the How Do I Know If I Am Using a Less Theme? section of the Kendo UI documentation.

Step 2: Migrate to a Sass-Based Theme

Follow the steps in the Kendo UI Less to Sass Theme Migration article to replace your Less theme references with their Sass counterparts.

Step 3: Use the Correct Theme Version for Your Telerik Reporting Release

Each Telerik Reporting version depends on a specific version of the Kendo UI theme. To find the correct version for your release:

  1. Open the Upgrade Overview and navigate to the upgrade path article for your Telerik Reporting version.
  2. In the upgrade article, find the HTML5 Report Viewer Dependencies section. The required Kendo UI Themes version is listed there.

For example, the 2026 Q1 (20.0.26.424) upgrade article specifies Telerik Kendo UI Themes (12.3.0). Use that version number in your CDN theme reference:

html
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/themes/12.3.0/default/default-ocean-blue.css" />

See Also