New theme > Greenish Fluent

[Morten]

Is using the Themebuilder the way to go if I want a greenish version of the Fluent theme for a .NET API/React web project?

I'm happy with the Fluent theme (which I currently use).

I only want a greenish colour palette (it's a sustainability project).

Also, I'm confused about the Themebuilder licensing. I have a DevCraft Complete subscription, and the plan overview says "Ultimate version is included with all Telerik and Kendo UI web product subscriptions, except for ASP.NET and AJAX.". However, I get popups saying to upgrade when I use the Themebuilder, and I get this message after the first project: "You have reached 1-project limit. Upgrade to have more projects."

/Morten

[Nick Iliev]

Hello Morten,

 

Thank you for your interest in ThemeBuilder and for reaching out to the support team!

First, I want to clarify the license issue. Our records indicate you have a DevCraft Complete Perpetual license that does not include a ThemeBuilder license. That is why you're currently using the ThemeBuilder free tier, which is limited to one project. The ThemeBuilder license is included with the DevCraft Subscription tiers (see the image for reference).

If you want to switch from perpetual to subscription licensing, please let us know, and a member of our sales team will contact you to discuss available options.

Regarding the customization of a theme with ThemeBuilder

Essentially, there are two ways to create a custom theme using your own color palette:

 

- The first is to manually set the desired colors by editing the exposed Kendo variables such as $kendo-color-primary, $kendo-color-secondary, $kendo-color-app-surface, and others.

Example for a theme with assigned custom values

 

 

- The second method involves using the AI assistant to generate your theme through natural language prompts. More details about using AI for this process are available in the following documentation article: 

 

https://docs.telerik.com/themebuilder/working-with-kendo/creating-themes-with-ai

 

Example custom theme created with AI

 

Regards,
Nick Iliev
Progress Telerik

[Morten]

Hi Nick. Thanks for your update.

Before deciding to change my license, I'd like to try the Themebuilder first.

So, in my case (accepting the Fluent theme except for some of the colours), I:

1) Create a new project based on the Fluent theme

2) change the color or each class (--kendo-color-primary-subtle, --kendo-color-primary-subtle-hover, etc.) for Kendo Colors Primary, Kendo Colors Secondary and Kendo Colors Tertiary

3) Export All and use in my react project

/Morten

[Nick Iliev]

Hey Morten,

 

Yes, that's pretty much the basic usage of a custom theme generated from ThemeBuilder. If you need more sophisticated customizations, you can also use the "Advanced Edit" mode to adjust specific CSS properties for specific component parts.

 

Once all customizations are complete, you can export the theme and use it as a SCSS package or as a compiled CSS file (depending on your project's requirements). Both approaches are documented in detail in the following article:

https://docs.telerik.com/themebuilder/using-exported-styles/exported-package