Create a Theme

Pro membership only!

To create a reusable theme for a visualization (under a Pro license in Superchart), head to custom themes in the left navigation.

1) Create New Theme

If you haven't already created a theme, click "+Create theme" in the middle of the page.

superchart design chart create new theme
Create Custom Design Theme for Chart Defaults

After clicking create, you'll be brought to a theme configuration screen.

2) Name the Theme

You'll want to give the theme a descriptive name. It will be available in the visualization configuration and you'll want an easy indicator of which theme to pick.

superchart design chart edit theme
Edit Theme for Chart Defaults

The configuration on the right panel includes a few different elements. We'll break them down so that you're familiar with the configurable details.

3) Configure Theme Elements

Configuring a theme will standardize elements across visualizations, including things like series colors, text, and other visual elements. You can choose a theme and apply it to an individual visualization. Themes are reusable and managed globally.

Color Palette

When you create a new theme you'll see a default color palette. It should give you some sense of how the colors will be used as you make changes to the theme. You can define six colors via a color picker or hex code that will be used as visualization series colors.

superchart design chart color palette
Configure Color Palette for Chart Defaults

Title

For the chart title, you can change the font type, weight (i.e. bold, thin, etc.), size (i.e. 10 pt, 12 pt, etc.), and color (via a color picker or hex code).

superchart design chart title
Configure Title Styling for Chart Defaults

Legend

For legend text, you can change the font type, weight (i.e. bold, thin, etc.), size (i.e. 10 pt, 12 pt, etc.), and color (via a color picker or hex code).

superchart design chart legend
Configure Legend Styling for Chart Defaults

X-Axis Titles

For x-axis text, you can change the font type, weight (i.e. bold, thin, etc.), size (i.e. 10 pt, 12 pt, etc.) and color (via color picker or hex code).

superchart design chart x axis
Configure X-Axis Styling for Chart Defaults

Y-Axis Titles

For y-axis text, you can change the font type, weight (i.e. bold, thin, etc.), size (i.e. 10 pt, 12 pt, etc.), and color (via a color picker or hex code).

superchart design chart y axis
Configure Y-Axis Styling for Chart Defaults

Background Color

Changing the background color for a visualization can be useful in either matching or creating contrast from the background on a blog post or website. Change the background via color picker or hex code.

superchart design chart background color
Configure Background Color for Chart Defaults

Logo

A logo can be uploaded to a theme and used across multiple visualizations using that theme.

superchart design chart logo
Configure Logo for Chart Defaults

4) Save Theme

After you've made the necessary changes, you'll want to save the theme.

superchart design chart save theme
Save Design Theme for Chart Defaults

This won't change any of your current, published charts automatically. If you want to apply these changes retroactively, you'll see the ability to do so when modifying an existing visualization.

Last Updated
March 6, 2023