How to change colors from light mode to dark mode in Taipy charts?

Question

I could not understand how to change colors automatically in a Taipy chart from light mode to dark mode. Is there a way to do it?

Answer 1

Charts have template properties in Taipy:

• template
• template[light]
• template[dark]

You can change through these templates how graphs are viewed depending on the mode. This is what Taipy relies on to provide a light/dark mode.

The template structure is given in the Plotly documentation.

Suppose you want to change other aspects of the application between light/dark mode. In that case, you can modify the stylekit or directly the theme where Taipy exposes a way to change to modify visuals/colors between light and dark mode.

Here is an example of a dark template with pink colors:

from taipy import Gui

chart_dark_template = {
    "data": {
        "scatter": [
                        {
                            "marker": {
                                "line": {
                                    "color": "#FFC0CB"
                                }
                            },
                            "type": "scatter"
                        }
                    ],
    },
    "layout": {
        "colorway": [
            "#FFC0CB",
            "#EF553B",
            "#00cc96",
            "#ab63fa",
            "#FFA15A",
            "#19d3f3",
            "#FF6692",
            "#B6E880",
            "#FF97FF",
            "#FECB52"
        ],
        "font": {
            "color": "#FFC0CB"
        },
        "mapbox": {
            "style": "dark"
        },
        "paper_bgcolor": "rgb(255,200,203)",
        "plot_bgcolor": "rgb(255,200,203)",
    }
}

# pink: rgb(255,200,203)
# pink: #FFC0CB

data = {
    "x": range(10),
    "y": [1,4,1,3,2,5,6,7,8,9]
}

md = "<|{data}|chart|template[dark]={chart_dark_template}|>"

Gui(md).run()