See how the ThemeBuilder Typography module for centralized font management and component-level AI theming enhancements can help in our app design and development.
Progress ThemeBuilder is a visual styling tool for customizing Telerik and Kendo UI components. Instead of digging through component documentation, ThemeBuilder provides an intuitive interface that allows us to see styling changes applied in real time. We can adjust colors, spacing, typography and more, then export production-ready CSS/SASS for our applications.
With the 2025 Q4 release, ThemeBuilder introduced two cool updates: a dedicated Typography module for centralized font management and component-level AI theming enhancements that give us finer control over AI-generated styles. In this article, we’ll spend a little time exploring both.
Before jumping into the new features, let’s quickly set up a theme using AI to see how these enhancements fit into the workflow. In the ThemeBuilder interface, we’ll find a Generate panel where we can describe our desired theme in plain English. To get started, we can enter something like: “Create a clean, modern analytics theme with a cool blue-gray palette that feels data-driven and professional, suitable for a B2B software dashboard.”
After generating, the AI analyzes the description and produces a cohesive design system. Within seconds, we’ll see a complete theme applied across all components: buttons adopt a refined blue accent, inputs feature subtle borders with appropriate focus states, and data visualization components like charts and grids receive complementary styling that maintains readability.
This theme serves as a good starting point. The colors work well together, the spacing feels balanced and there’s visual consistency across the component library.
But what if we want to adjust the appearance of specific components without altering the entire theme? This is where the new component-level AI theming comes in.
One of the challenges with theme generation with AI has been the “all or nothing” approach. Previous AI theming would regenerate our entire theme, which was great for starting fresh, but less helpful when we only wanted to tweak how buttons looked or adjust the styling of our data grid headers.
The new component-level AI theming enhancements solve this problem. We can now target individual components with AI-assisted styling while preserving our overall theme. Instead of manually hunting through variables and properties, we can use the AI theming interface to target just, say, the React Button component.
To see an example of this, we can enter a specific prompt like: “Make the primary button more prominent with a stronger visual presence and subtle gradient that draws attention for call-to-action scenarios.”
The AI adjusted only the primary (solid) button-related variables and styles, enhancing the gradient effect and adding a bit more visual weight to the component. The rest of our theme remains untouched!
We can continue refining our design in the same way. For example, we can apply an AI-driven override to the specific React TextBox component to make it more visually distinctive and usable.
We might use a prompt like: “Redesign the TextBox component with a more prominent border, a subtle background tint, stronger focus glow, and slightly increased padding to make input fields visually distinct and easier to scan in complex layouts.”
The AI updates only the TextBox-related styles while preserving other existing styles in the components module.
While AI theming handles creative decisions, the new Typography module provides structured, systematic control over typography settings of our theme and is located alongside the existing modules like Metrics, Colors, etc.
In the module, we can define reusable typography variables that bundle multiple text properties into a single unit. Each variable can include font family, size, line height, letter spacing, text transform, font style and text decoration.
Once defined, these typography variables can be assigned to component parts like inputs, headers and form labels. Here’s an example of applying a custom typography set to the text of the Button component.
This provides both flexibility and long-term maintainability, allowing typography variables to be defined once and applied consistently across components with just a few clicks.
The 2025 Q4 updates to ThemeBuilder address two common pain points.
Ready to try these new capabilities? Explore ThemeBuilder and see how the latest updates can streamline your theming workflow.
If you aren’t already using Telerik or Kendo UI components, see how ThemeBuilder complements these robust libraries in the Telerik DevCraft bundles.
Hassan is a senior frontend engineer and has helped build large production applications at-scale at organizations like Doordash, Instacart and Shopify. Hassan is also a published author and course instructor where he’s helped thousands of students learn in-depth frontend engineering skills like React, Vue, TypeScript, and GraphQL.