Category / Section
Enhance Widget Visuals with Custom Data Color Palette Themes in Bold BI
Published:
The data color palette theme in Bold BI allows you to apply the same colors to all the widgets in your dashboard. This is useful for maintaining consistency and improving visualization. By generating a custom theme and uploading it to the server, you can apply the custom theme to your dashboard. The data color palette property in the theme variables will ensure that the same colors are applied to all the widgets. For more information on customizing themes and using the data color palette property, you can refer to the documentation.
Steps to Customize Data Color Palette
Download the Theme Package
- At first, download the most recent release package for the custom theme and extract it. Inside the extracted files, you will discover distinct theme files for each widget, and dashboard element.
Modify Theme Variables
- Open the theme file you want to customize from the extracted files.
- Search for the
-designer-data-color-palettevariable within the file namedboldbi.data.colorpalette.definition.css. - This variable controls the color palette that will be applied to the widgets.
Assign Color Palette
To set your desired color palette, update the
--designer-data-color-palettevariable with your chosen color codes. For example::root {
--designer-data-color-palette1:#003f5c;
--designer-data-color-palette2:#374c80;
--designer-data-color-palette3:#7a5195;
--designer-data-color-palette4:#bc5090;
--designer-data-color-palette5:#ef5675;
--designer-data-color-palette6:#ff764a;
--designer-data-color-palette7:#ffa600;
}Apply Changes
- Save the theme file with the updated variables.
- Follow the knowledge base articles to generate the custom dashboard theme minified file and upload it to the server.
Additional References
- How to generate custom dashboard theme and upload it to server
- Custom Themes for Dashboards Using CSS3 Variable
Note: At present, the customized theme is structured to support a maximum of seven color selections that can be chosen and established within the color palette.
PN
