Overview
The Branding Tab allows you to customize the logo, help links, and the theme (color palette) for your enterprise.
Logo
Provide a custom logo by uploading the image to be used into the logo section. Select the “Upload New” button to browse through your folders to find a suitable image. This logo will be displayed when the sidebar is expanded.
Note: Logo tip – use the company Twitter logo. Since it is a square, it often fits well.
Links
To customize the links in the navigation sidebar, enter custom URLs in the provided fields. You can choose from: All Help Topics, Privacy Policy, and Feedback links for implementation. Leave the fields blank to use Shibumi default links.
Theme
The Theme section allows you to configure the color of multiple elements within your solution, the data in your charts, and the Color Panel.
Note: Any Theme color can be reverted to the Default by clearing out the hex-code and saving.
Multiple elements can have their color configured to match a specific brand, below is a description of each and where the color change will be represented:
Branding
Defines the color of the Navigation Sidebar.
Primary
Defines the color of clickable UI elements such as Tabs, Buttons, Links, etc.
Secondary
Defines the color of the Page-Level Filter bar.
Info
Defines the color of any Information fields within forms and can be used in Alert sections.
Success / Warning / Error
Defines colors used in success/error notifications, conditional formatting, and Alert sections.
Chart Colors
- Enter Chart Colors to dictate what colors are used as the data series for your charts as well as defining the Enterprise Colors for the Color Panel to be used on Custom Sections.
- The order in which the color codes are entered determines the order of the data series colors and Enterprise Colors.
- Select “Copy Chart Colors to Clipboard” and paste into a document if you wish to change the order of the color codes.
- If no colors are selected, Shibumi colors will be used by default.
Note: If you do not have access to color codes, you can select the painter’s palette icon to open a separate UI to drag and drop to find the color you are looking for, as seen below.
Color Panel
The color panel is found on any Custom Section with a color-select field within the Settings dialog. The Color Panel is comprised of a set of Greyscale Colors, Enterprise Theme Colors, any enabled App Colors, and the first 12 Chart Colors numbered based on their order in the list. Each color is given 7 different gradients along with the original color to choose from, as seen in the image below.
Notes:
- Any colors set can be reverted by selecting the Undo button in the color field, this results in the next Enterprise Color being set instead.
- The top bar of the Color Panel will change depending on the color selected, it will also display the hex code and gradient for the color.
- A color can be defined by an expression via the field in the bottom of the Color Panel.
- Custom Sections utilizing Enterprise Theme Colors, App Colors or Chart Colors will automatically update when the respective color is updated.
- If a Custom Section is using an App Color that has been disabled, it will be replaced with the default App Color.
- App Colors will only be displayed if they have been configured