Theming Apache Superset with the Ant Design theme system

Apache Superset themes are sets of Ant Design tokens that control colors, typography and layout across the UI. This page explains how to design, apply and govern them on an instance you run.

On this page

When Apache Superset theming with Ant Design tokens is worth planning

Plan theming before the first dashboard is published if your platform team or BI lead needs Superset to match corporate branding, or to offer a dark mode alongside the default light one. Superset's visual layer is built on Ant Design, and its theme system works through Ant Design design tokens: a set of named values for things such as colors, fonts and sizing that the interface reads when it renders. A Superset theme changes how the application shell and its components look. It does not change the data, the chart logic, the semantic layer, the row level security rules or the roles that decide who sees what. Those stay exactly as your data team configured them. Confirm the exact token names and their current behavior against the Superset documentation for your release, because the set of supported tokens is version specific and this page does not list them.

Timing matters because a theme is applied across the whole interface, but some visual decisions are baked into content people have already built. Dashboards, saved charts and exports created before a theme change may look different afterward, and any chart styling you set inside a single chart is not replaced by a global theme. Decide early which surfaces must be consistent, including embedded dashboards, reports and screenshots shared outside Superset, and which are internal. Ask who owns the theme definition, who can apply it system wide, and whether dashboard owners may choose their own theme. Those answers determine whether the work is a one time configuration or a small governance process that needs a review step before each change.

Before rollout, run a short check with a representative set of dashboards in a staging instance built from the same version and configuration as production. Look at dark and light variants, text contrast, long labels, and the admin screens your team will use every day. Also confirm what happens when a theme fails to load or contains an invalid value, since the fallback behavior determines whether users see a broken interface or the default one. Record the results and the Superset version they were tested on, so a later upgrade can be checked against the same list rather than rediscovered. If your team cannot name an owner for the theme definition, that gap is the first thing to resolve.

What a Superset theme controls

A Superset theme sets the visual tokens that the whole interface inherits, but several neighboring settings look similar and are configured elsewhere. Splitting the theme into its parts shows which decisions you make once for the instance, which you can let dashboard owners make, and which belong to other customization work.

Design tokens

Tokens are the named values a theme sets, such as brand colors, font families, border radius and text sizes. Components read these values, so one change can restyle menus, tables and charts together. Before you start, list the tokens your brand guide defines and check which ones Superset exposes in the theme JSON for your release. Test a few representative pages after each change, since a token that looks correct on a dashboard may clip text in a dense table.

Light and dark variants

A theme is a complete set of values for one mode, so a light and a dark variant each need their own tokens and contrast checks. Confirm that charts, legends and modal dialogs stay readable in both modes, not only the page background. Decide whether dark mode is offered to users at all, because a second variant doubles the review work for every later brand change.

System themes

A system theme is the default that applies across the whole Superset instance, including the menus and screens that are not inside any dashboard. Changes here affect every user on the instance, so treat them as a release with an owner and a rollback copy. Ask your administrators which theme is set as the default and who may change it, and record that in your change process.

Dashboard themes

A dashboard theme applies to one dashboard and overrides the system look for that dashboard only. It suits client-facing or departmental dashboards that need their own identity, but every dashboard theme becomes something to review and maintain. Decide who may assign dashboard themes, and check how a dashboard looks when the system theme changes underneath it.

Theme administration and fallbacks

Themes are created and assigned through Superset's administration interface, and an invalid or incomplete theme can fall back to defaults rather than failing loudly. Plan validation as a step in your rollout: load each theme in staging, check the affected pages, and confirm what the fallback looks like. Copying a theme between instances should be treated as a configuration change to review, not a copy-paste.

Parts outside the theme

Some visual changes are outside the theme system: custom CSS, ECharts overrides for chart styling, logo and app name settings, fonts loaded from external hosts, and map tiles. Each has its own precedence rules and its own security effects, such as Content Security Policy changes for fonts and tiles. Use the sibling topics on branding, fonts, chart overrides and map tiles for those decisions, and keep this theme work limited to tokens and modes.

System themes versus dashboard themes

A single corporate look means one system theme applies to every user and every dashboard on the instance. This is the simplest model to govern because one person or team owns the token set, and every screen follows the same palette, typography and component styling. The instance administrator sets the system theme through the UI administration area, so changes are visible to all users at once and need a clear owner and change record.

  • Ownership: One named owner, usually the platform or BI team, approves changes to the system theme.
  • Blast radius: A bad token change affects every dashboard and chart, so test it in a staging instance first.
  • Consistency: Charts, menus and modals share the same look, which matters most for reports exported to executives or regulators.
  • Recurring work: Each upgrade may change component styling, so review the theme after every version change.
  • Scope limit: Most organizations keep one system theme per instance, so separate brands or business units may need separate instances.

Before you commit to this model, confirm with your Superset version's documentation which theme settings the instance administrator can change in the UI and which need a configuration file change and restart.

Theme configuration options and when each fits

This table compares the four ways to set a Superset theme: UI administration, JSON theme definitions, light and dark variants, and the default system theme. Read each row as a decision: what the route suits, what it needs from your team, and which keys to confirm against the release you run before you commit.

RouteWhen it fitsWhat it requires
UI administration in SupersetQuick trials and small teams that want to adjust colors without deploying codeAn admin account with theme permissions, and a change log kept outside the instance, since UI edits are not versioned in your repository
JSON theme definitionsOrganizations that want themes reviewed, versioned and promoted between environmentsSomeone who owns the token file, a deployment step that loads it, and a check that token names match the Superset release in use
Ant Design tokensSetting shared values such as brand colors, font family and border radius across the whole interfaceToken names taken from the Ant Design version bundled with your Superset release; confirm each key in that version's documentation before use
Light theme variantDefault reading mode for most users and for exported or printed dashboardsContrast checks on chart palettes, since chart colors may not change with the interface tokens
Dark theme variantTeams whose analysts work long sessions or display dashboards on dark screensA separate set of tokens tested against your charts, text and status colors; confirm whether dark mode is switched per user or per instance in your version
System theme (default)Instances where users should follow their operating system preference with no extra setupNo configuration beyond keeping the default; it does not carry your brand unless the light and dark tokens are also set
Dashboard-level themeA dashboard that needs its own look for a business unit or an embedded audienceDashboard theme assignment rights for editors, and a review step so that one dashboard does not drift from the instance standard

How to create and apply a Superset theme

This sequence takes a theme from a draft in a non-production instance to a tested light and dark pair, a system default and any dashboard-specific overrides. Each step ends with a check so the team knows the theme is ready to promote.

  1. Confirm the Superset version and admin access

    The platform engineer records the exact Superset version running in the staging instance and confirms it against the release list on the project's GitHub releases page. Theme administration depends on the version, so the team reads the theming documentation for that release before drafting anything. They also confirm which account will apply themes and that it holds an administrator role with permission to change instance-wide settings. Done means the version, the documentation link and the named administrator account are written in the change record.

  2. Draft tokens in a non-production instance

    A designer or front-end engineer drafts the theme's token values, such as primary color, font family, border radius and background colors, in a non-production instance. Token names and accepted formats come from the Ant Design theme system that Superset uses, so the team checks them against the Superset documentation for the chosen version. Keep the draft in version control so changes are reviewed and can be reverted. Done means the draft file loads on the staging instance without errors in the browser console.

  3. Apply the light theme first

    The administrator registers the draft as a light theme through Superset's theme administration screen, then selects it for testing on the staging instance. Start with light mode because most brand work, including logos, headings and chart palettes, is easier to judge against a neutral background. Confirm the menu path in your version's documentation, since screen names change between releases. Done means the light theme is listed, applied to staging and visible on the home page and at least one dashboard.

  4. Add and tune the dark variant

    The designer creates a dark variant with its own token values rather than inverting the light palette automatically. Contrast problems often appear in chart labels, table borders, tooltips and disabled controls, so each token is adjusted for readability on a dark background. The administrator then registers the variant as a separate theme entry. Done means both themes exist as separate entries and the dark variant has been reviewed on the same dashboards used for the light theme.

  5. Set the system default theme

    The administrator selects the light or dark theme as the instance-wide default, which applies to users who have not chosen a theme in their own settings. Confirm whether your version lets users switch between light and dark and which setting controls that choice, because this determines what users see on first login. Record the chosen default in the change log. Done means a new test user who signs in with no preferences sees the intended default on the home page and in the chart explorer.

  6. Assign dashboard themes where needed

    Dashboard owners who need a distinct appearance, such as a board for a regulated report or an executive view, attach a dashboard theme in the dashboard properties. Assign these only where there is a stated need, because each dashboard theme is one more configuration to review after upgrades. Record each assignment with its owner. Done means every dashboard with a custom theme is listed in the change record and opens with the expected theme on a clean browser session.

  7. Check rendering in both modes

    A tester walks through the screens that most often expose gaps: charts, filter bars, modals, dropdowns, the SQL Lab editor, alert and report forms, and error messages. They run this check in both light and dark mode, in the browsers your users run, and at the screen sizes your organization supports. Missing colors, unreadable text and fallback fonts are logged as defects against the token that caused them. Done means a signed-off checklist exists for each mode and any open defects have an owner before the theme moves toward production.

How to copy themes between instances without drift

A theme tested in staging should reach production as the same JSON, not as a fresh set of manual edits. The theme is a set of Ant Design tokens and their values, applied through the Superset theme settings. When someone re-creates it by hand in production, small differences in font weights, color values or token names tend to creep in, and the reviewed staging result no longer describes what users see. Export the theme definition from the instance where it was approved, store that exact file, and import the same file into each target environment. Then compare a few reference dashboards and charts on both sides before you call the copy complete. Ask your team to confirm whether the theme was edited through the UI after import, because any later UI change silently creates a second version.

Version differences can change how the same tokens render. Superset upgrades bring new components and updated Ant Design styling, so a token that looked correct on one release can shift spacing, contrast or component appearance on another. The same risk applies when one environment runs an older Superset release or a different Ant Design version in a custom build. Before promoting a theme, record the Superset version and the Ant Design version in both environments, and check the release notes and UPDATING.md notes for changes that affect styling. Treat a Superset upgrade and a theme change as separate, sequenced releases so a visual regression can be traced to one cause.

Store theme definitions in version control next to the rest of your deployment configuration, such as the superset_config.py file, image build files and environment manifests. A versioned theme file gives you a reviewed history, a clear owner, and a rollback target if a theme breaks a dashboard. It also lets the same commit build the same image in every environment. Keep secrets out of the theme file, since font URLs and asset paths may point to internal hosts that differ between staging and production. Agree on a review step for any theme change, and record which Superset release each theme version was validated against so the next upgrade starts from a known baseline.

What happens when a theme fails validation

A theme can fail in several predictable ways, and each one can leave users with an unreadable, broken or unexpected workspace. The five cases below are the ones to plan for, each with the fallback to confirm in your Superset version and the check that catches it before users do.

Malformed theme JSON

A missing comma, a trailing comma or an unquoted key stops the theme definition from parsing. Confirm whether your version rejects the save in the UI administration screen or accepts the file and fails at load, and whether the previously saved theme keeps serving. Catch it early by running every theme file through a strict JSON parser in your repository and again on the staged export before it reaches the instance.

Unsupported token names

A misspelled token or a name that does not exist in the Ant Design token set may be ignored without a visible error, so the color or size you intended never appears. Confirm whether Superset logs a warning or rejects the key in your version. Check by comparing every key in the theme file against the token names your release supports, then viewing a dashboard in a staging browser to confirm each change took effect.

Contrast problems in dark mode

A dark theme can pair text, axis labels or table headers with backgrounds that are too close in value, especially when chart palettes were chosen for light mode. Confirm whether Superset applies any automatic correction for this, and assume it does not until you have tested. Check each chart type you publish in dark mode, including legends, tooltips and empty states, using a contrast checker against the WCAG thresholds your organization applies.

Missing fonts or assets

A font URL that is unreachable, a logo path that returns a 404 or a font host blocked by a Content Security Policy can leave the theme half applied. Confirm which fallback the browser uses for each asset type in your version, typically a system font or a missing image. Check by loading the theme on a network that matches your restricted egress rules and reviewing the browser console for blocked or failed requests.

Dashboards assigned to deleted themes

A dashboard can keep a reference to a theme that was deleted, renamed or not carried over in an import or restore. Confirm whether the dashboard then falls back to the system theme, shows an error or fails to load. Check after every migration, export or restore by listing dashboards with theme assignments and comparing them against the themes that exist on the target instance, and include that comparison in your restore test.

Questions buyers ask about Superset theming

What does theming Apache Superset cost, and what drives the effort up?

Theming cost comes from the amount of design decisions, the number of themes, and how much verification the brand requires. A token-only theme that changes colors, fonts and the logo is a small, bounded task. Cost rises when the brand needs separate light and dark themes, custom font loading, chart-level overrides, or validation across many dashboards and browsers. The fixed scope document should list each theme, each surface that must be checked, and who signs off. Ask for the price to be broken into design review, build, validation and handover, and state which items are one-time and which recur at upgrade time.

Can our own team theme Superset without a partner?

Yes, a team with administrator access and some front-end experience can apply a basic theme through Superset's theme settings and configuration. The harder part is repeatable delivery: keeping theme JSON in version control, copying it between instances, and confirming that a bad token falls back safely. Teams that already run Superset from configuration files usually find this manageable. Teams without that practice should confirm who will own the theme after handover, because a theme that only one person understands becomes a risk at the next upgrade.

How long does it take to validate a basic corporate theme?

Duration depends on the number of surfaces that must be checked, not on the token count alone. Validation covers the main navigation, dashboards, charts, modals, the light and dark variants if both exist, and any exported or embedded views. No timeline figure is given here because it depends on the brand guide and the environment. Ask the partner to state the validation steps in the written scope, the number of review rounds included, and the environments where checks run, including the staging instance used before production.

What do we need to provide before theming work starts?

The work needs four inputs: a brand guide with exact color values, font files or licensed font URLs, the logo files in the formats the brand team approves, and a decision on which themes are needed. Technically, the team needs administrator access to the Superset instance and access to the configuration repository. A staging instance that mirrors production is strongly recommended, so theme changes can be reviewed before users see them. Confirm who approves design sign-off and who has authority over brand exceptions.

Do theme changes survive a Superset upgrade?

Theme configuration is usually kept separate from application code, so it often survives an upgrade, but this must be tested rather than assumed. The Superset upgrade process requires backing up the metadata database, running the database upgrade and init commands, testing in staging first, and checking UPDATING.md for breaking changes. Theme keys, component behavior and the underlying Ant Design version can change between releases. Plan a theme regression check as part of every upgrade and ask who maintains it.

What happens when a theme token is invalid?

Invalid or missing tokens should not break the application, but the exact fallback behavior must be verified on your version. A malformed theme can produce default colors, mismatched components, or unreadable text, especially in dark mode where contrast is easy to lose. Include contrast checks for text and chart colors, and test that a theme with a deliberate error still loads. Ask the partner to show which validation steps are automated and which are manual.

Which Superset version should we theme against?

Choose the version you intend to run in production, then theme against that version's documentation and the Ant Design version it bundles. Superset 6.1.0 was published on May 13, 2026, and 7.0.0rc2 is listed as a pre-release, so a theme built now should be checked against the release you actually deploy. Confirm the target version before design work starts, because a later major version may change theme behavior.

How DeployOpen scopes and delivers Superset theming

DeployOpen scopes Superset theming in writing before any work starts. The written scope names which theme entries will be created, whether they are system themes or dashboard themes, which light and dark variants are required, and which dashboards or user groups will use each one. It also records who approves the token values, such as brand colors, font families and border radii, and who administers theme assignments in the Settings menu after handover. Because theme changes touch every page that uses them, the scope should state which of your instances are in the theming change and whether a staging copy must be refreshed before validation. Most engagements are fixed-scope, so the quote follows from this document rather than from an estimate of effort.

Validation happens on a staging instance that matches production in its Superset version, its configuration and its theme-related settings. DeployOpen checks each theme against the charts, tables and modals your users rely on most, including dark mode contrast, the fallback behavior when a theme JSON fails validation, and dashboard theme overrides. Ask whether your staging database and authentication setup mirror production, since a theme that looks right with test data can behave differently with real dashboards. Where the work depends on a Superset upgrade, the upgrade steps in the upgrade documentation apply in staging first, and the theme is retested after the upgrade.

DeployOpen documents the final theme definitions, including token values, the scripts or JSON used to create them and the administrative steps for copying a theme between instances, so the definitions can live in your repository and be reviewed like other configuration. Ongoing support for theme maintenance and Superset upgrades is available as a retainer, which is a recurring agreement separate from the one-time implementation. When you ask for a quote, request the list of deliverables, the staging validation steps, the documentation format and the terms for post-handover changes, and confirm with your own platform team which Superset version you will run, since that version determines which theme settings are available.

Talk to our team.

Tell us what you're working on, whether it's a deployment, an audit, a security test or a cyber range. You'll speak with an engineer who can help you scope it.

  • 30-minute call: free, with no obligation.
  • NDA on request: we can sign before you share details.
  • Clear next steps: a scope and plan after the call.