Report themes

Your Workspace includes a number of built-in themes which you may be able to compliment with custom themes.

Add a custom theme

1. Navigate to the Mode home page, click on your name in the upper left corner of the screen and click

   Workspace Settings

   from the dropdown menu.
2. Under Features, select

   Colors & Themes

   .
3. Click on the

   Report Themes

   tab.
4. Click on the

   New Theme

   button.
5. Enter a name for your theme. In the CSS box, paste or write the CSS for this theme. To import a hosted CSS file, you can use an @import statement (e.g., @import url("https://example.com/stylesheet.css")).
6. When you are finished, click

   Save

   .

Any valid CSS can be included in a custom theme. While you cannot included any JavaScript in a custom theme, you can embed JavaScript in reports directly using the HTML Editor.

Manage custom themes

Any member can use or create a custom theme, however a custom theme can only be edited or deleted by it's creator or and Workspace admin. You cannot delete any of the built-in color themes. To manage:

1. Navigate to the Mode home page, click on your name in the upper left corner of the screen and click

   Workspace Settings

   from the dropdown menu.
2. Under Features, select

   Colors & Themes

   .
3. Click on the

   Report Themes

   tab.
4. To modify a custom theme, locate it in the list and click on it. Make any changes and click

   Save

   .

5. Click on the button next to a theme for additional options:

   • Set as default

     : Admins only. Set this theme as the default for all new reports. Does not impact any existing reports.

   • Delete

     : Deletes the theme.

Color palettes

Your Workspace includes a number of pre-defined color palettes which you may be able to compliment with additional custom color palettes.

Add a custom color palette

1. Navigate to the Mode home page, click on your name in the upper left corner of the screen and click

   Workspace Settings

   from the dropdown menu.
2. Under Features, select

   Colors & Themes

   .
3. Click the

   New Color Palette

   button.

4. Enter a unique name and select either Categorical or Divergent palette type:

   • Categorical

     : Used with most built-in charts (e.g., line, pie, bar, etc.). Input between 2 and 20 different color hex codes. After writing or pasting in a value (e.g. #37B067), press

     enter

     to confirm. Use the X button to remove the value.

   • Divergent

     : Used with Big Number visualizations. Input a color hex codes for each end of the color gradient.
5. Click

   Save

   .

Manage custom color palettes

Any member can use or create a custom color palette, however a custom color palette can only be edited or deleted by it's creator or and Workspace admin. You cannot delete any of the built-in color palettes. To manage:

1. Navigate to the Mode home page, click on your name in the upper left corner of the screen and click

   Workspace Settings

   from the dropdown menu.
2. Under Features, select

   Colors & Themes

   .
3. To modify a custom color palette, locate it in the list and click on it. Make any changes and click

   Save

   .

4. Click on the button next to a color palette for additional options:

   • Set as default

     : Admins only. Set this palette as the default for all new reports. Does not impact any existing reports.

   • Delete

     : Deletes the palette.