Installation of the CSS Utilities
The CSS Utilities are available as an NPM module that you can install. Alternatively, you can also consume them directly from the Kendo CDN.
For a while, the CSS Utilities were bundled with the Telerik and Kendo UI themes. Starting with themes version 9.0.0, the CSS Utilities are no longer included in the Telerik and Kendo UI themes package.
You can include the CSS Utilities in your project in either of the following ways:
To install the CSS Utilities, use the following command:
npm install --save @progress/kendo-theme-utils
Using Precompiled CSS
To add the Telerik and Kendo UI CSS Utilities to your application, you can include the precompiled dist/all.css file that contains all available utilities.
node_modules/@progress/kendo-theme-utils/dist/all.css
This approach is fast but doesn't allow you customizations, and you cannot exclude groups of unused utilities. You can eliminate these disadvantages by using the build process of the application.
Using the Build Process of the Application
Another way to include the Telerik and Kendo UI CSS Utilities into your project is to import the source SCSS file.
@import '@progress/kendo-theme-utils/dist/all.scss';
Using a CDN Link
The CSS Utilities are also hosted on the Telerik CDN server and can be referenced without the need for local installation. To include them in your application, add the CDN link with the CSS utilities in the head element of your page.
<!-- CSS Utils -->
<link
rel="stylesheet"
href="https://kendo.cdn.telerik.com/themes/{kendo-themes-version}/utils/all.css"
/>
Alternatively, you can use a link extracted from unpkg, for example:
<!-- CSS Utils -->
<link rel="stylesheet" href="http://unpkg.com/@progress/kendo-theme-utils/dist/all.css" />
