This topic provides basic concepts to better understand theme variables.

Generated palettes

Colors palettes (such as mt-blue-*) are generated from a base color.

This is based on Material Design guidelines.

Color variables naming consistency

• palette-* are for color palette variables (with generated variants)
• theme-* are for theme-wide variables
• gbc-*Widget-* are for specific widget/widget family variables
• *-primary-*-color are aimed at featured elements like buttons, topbar, highlighted table lines
• *-secondary-*-color are aimed at standard elements like containers, labels
• *-field-*-color are aimed at field elements

Theme variables you can use/change in your theme.scss.json file

The Theme variables reference page provides a complete list of the theme variables.