Dark mode with Multipage app In Dash

Dash Python
1

I Build an app Multipage with dash ploty

Can I add Dark Mode ?

2

It depends on the UI framework that you are using. If it is dash-mantine-components for example, it is very simple to add dark mode via the MantineProvider component,

3

thank you @Emil

I use dash_bootstrap_components

4

Hi @sanae

You can find lots of info on how to add a theme switch component and style a dash app with a Bootstrap theme here:

Note that with multipage apps, you would just need to include the theme switch component in the app.py file so it’s available on all the pages.

1 Like
5

thank you @AnnMarieW

Is that normal ? Or The plots also must turn to dark mode

Cply
Cply771×658 33.7 KB

6

Yes - it’s normal - the figures need to be updated with the new figure template when the theme changes.

If you want to use the Bootstrap themed figure templates, you can see examples of how to do that on this page: Dash Bootstrap Theme Explorer

However it looks like you may be using custom colors for the traces, in that case you may just want to use the plotly_dark figure template: Theming and templates in Python

1 Like
7

@AnnMarieW It’s helpful … Thank you sooo Much