Skip to content

How to use themes

This guide shows you how to use themes. Themes are pre-designed collections of stylings that are applied to entire charts and dashboards. The themes provided by Vizro are induced with our design best practices that make charts and dashboards look visually consistent and professional.

Themes in dashboards

The Dashboard model accepts the theme argument, where you can currently choose between a vizro_dark and a vizro_light theme. This theme will be applied on the entire dashboard and its charts/components. During run-time you can still switch between the themes via the toggle button in the upper-right corner of the dashboard.

Change theme

import vizro.models as vm
import as px
from vizro import Vizro

df =

page = vm.Page(
    title="Changing themes",
                df, dimensions=["sepal_length", "sepal_width", "petal_length", "petal_width"], color="species"

dashboard = vm.Dashboard(pages=[page], theme="vizro_light")

# Still requires a .py to register data connector in Data Manager and parse yaml configuration
# See yaml_version example
- components:
  - figure:
      _target_: scatter_matrix
      color: species
      data_frame: iris
      dimensions: ["sepal_length", "sepal_width", "petal_length", "petal_width"]
    type: graph
    - column: species
      type: filter
  title: Changing themes
theme: vizro_light



Themes in plotly charts

You can also use our templates for plotly charts outside the dashboard. Our vizro_dark and vizro_light theme are automatically registered to when importing Vizro. You can find more details on how templates work in here.

Set themes for all charts

The default template is set to be vizro_dark as soon as you import vizro:

import as pio
import vizro
Templates configuration
    Default template: 'vizro_dark'
    Available templates:
        ['ggplot2', 'seaborn', 'simple_white', 'plotly',
         'plotly_white', 'plotly_dark', 'presentation', 'xgridoff',
         'ygridoff', 'gridon', 'none', 'vizro_dark', 'vizro_light']

All plotly charts run after the import vizro command will therefore have the vizro_dark template automatically applied without further configuration.

To change the default plotly template globally, run:

import as pio

pio.templates.default = "vizro_light"

Set themes for selected charts

To change the template for a selected chart only, use the template parameter and run:

import as px

df =
                  dimensions=["sepal_length", "sepal_width", "petal_length", "petal_width"],


Please note that using import as px is equivalent to using import as px, but with the added benefit of being able to integrate the resulting chart code into a Vizro dashboard. Vizro offers a minimal layer on top of Plotly's existing charting library, allowing you to seamlessly use all the existing charts and functionalities provided by without any modifications.