Themes

While designing the web application, you can apply different color schemes and typography settings and meet the requirements of specific brandings.

Getting Started

To change the colors and typography for the Kendo UI library, use the THEME plugin tab. If two or more themes are available, switch between them by clicking on the theme items.

Plugin Themes Functionality

When the colors or typography are modified after the export of the design to Unite UX Studio, the new values will be passed to the generated application as SASS variables through the metadata.

Creating New Themes

To create a new theme:

  1. Duplicate an existing theme by selecting Duplicate from the context menu of the library item. As a result, the plugin opens the theme in the Sketch.

    Plugin Duplicate Themes

  2. Start editing the theme by clicking the Pencil button. As a result, the new view with all available styles and typography is displayed.

    Change color

  3. Update the colors by clicking the shared style. As a result, a color picker appears and you can change the color of the style.

    Change color

  4. Update the typography settings by expanding the typography item. Immediately after you blur the editor, all changes are applied and the result becomes available in the library.

    Change typography

  5. Save the new theme and update the document that will use it. As a result, the updated service of the Sketch symbol will show the change notification in the upper-right corner and you can update the document with the changed theme symbols.

Importing Existing Themes

The Unite UX Sketch plugin enables you to import a library which is already created and which uses different themes.

  1. Click the Import Library button to open a Search dialog.
  2. Import the Kendo UI library by selecting it. As a result, the library is added to the themes list.
  3. Link the existing document to it. The new theme library is also added as a Sketch library.
In this article
Not finding the help you need?