Themes / White labeling

Theme settings

On the theme configuration page, you can customize the look and feel of your environment. Change background images, upload logos, and adjust branding elements like colors and typography to match your unique style. Tailor the user interface to reflect your company’s identity, ensuring a consistent experience for users across your platform. The theme settings are divided into 3 main sections: Branding, General Colors and Model Colors.

• Branding: Here you can personalize key visual elements of your environment, including header backgrounds, logos, and thumbnails. This allows you to create a consistent brand identity across the platform.
• General Colors: Customize all the application colors for both Light and Dark modes, effectively giving you two complete theme settings for each environment.
• Model Colors: Here you can customize the colors of the modeling attributes. This is useful when you want to have a different color for the models than the rest of the application.
• ** Dataset Colors**: Here you can customize the colors of the dataset attributes. This is useful when you want to have a different color for the datasets than the rest of the application.
• ** Chart Colors**: Here you can customize the colors used in charts. This is useful when you want to have a different color scheme for your charts than the rest of the application.

Brand your environment

Here you can personalize key visual elements of your environment, including header backgrounds, logos, and thumbnails. This allows you to create a consistent brand identity across the platform. Whether you’re updating your company logo or setting a custom background, these tools help you refine the look and feel of your application.

General app colors

Personalize the application colors for both Light and Dark modes, effectively giving you two complete theme settings for each environment. Be sure to test your changes carefully to ensure good contrast between text and backgrounds for optimal readability and user experience. With this flexibility, you can fully tailor the look and feel of your platform to match your brand’s identity across different modes.

Process Model colors

Personalize the Modeling object and canvas colors for both Light and Dark modes, effectively giving you two complete theme settings for each environment. Be sure to test your changes carefully to ensure good contrast between text and backgrounds for optimal readability and user experience. With this flexibility, you can fully tailor the look and feel of your platform to match your brand’s identity across different modes.

Dataset colors

Personalize the Dataset object and canvas colors for both Light and Dark modes, This is used if you add multiple dataset to your modals. This will give you the ability to distinguish between datasets in your models. Dataset colors are used for attributes that have data attached to them. This helps visually distinguish attributes with active data links. The colors mentioned above are the default colors for attributes without data attached to them. Also the names can be changed to better reflect your own terminology.

Chart colors

Personalize the Chart object colors for both Light and Dark modes. This is for instance used in the Norm settings of the Gauge charts to indicate good, caution, and warning zones. Also the names can be changed to better reflect your own terminology.

Visual helpers

If you made changes to the theme, the background of the color will indicate that changes have been made to that specific attribute.

To change a color, click on a colored circle for the chosen theme (Light or Dark). A color picker appears, letting you select a shade or input a HEX / RGB / HSL value. If you’re unsure of the color values, use the “PipetIcon” to select a color from anywhere on the screen. Immediate updates occur.

Example of a theme

Explore different ways to transform your application’s theme. Here, the original theme has been customized to showcase blue and green variations.

From Original

To Blue

Changes that were made were Text Color, Body Color, Panel (light) color, Logo image, Logo Text, and Header BG.

To Matrix Green

”Choice. The problem is choice” – Neo (The Matrix Reloaded)

Process Model Colors

Adjust the colors of the modeling attributes to differ from the rest of the application. This ensures a distinctive look for your models.