Streamlit has a new Theme for Plotly
Streamlit has a set of colours that is consistent throughout the app but Plotly did not conform — with Streamlit 1.16, this has changed.
Streamlit’s standard theming is clear and appealing, but until now when creating Plotly charts, you were stuck with Plotly’s standard theme and its light blue-grey background.
And although Plotly provides a mechanism for changing from the standard theme, for some reason this does not work inside a Streamlit app.
Streamlit’s designers would obviously like to keep things consistent and so, as of version 1.16, it’s out with the old Plotly colours and in with a new Streamlit-friendly theme.
You can still use the old theme if you would like, by utilising a new parameter, e.g.
#'theme' can only take one of two values: 'Streamlit' or None.
st.plotly_chart(c, theme=None)
The new parameter can only take one of two values (as detailed above) meaning you can choose between the new standard theme or the original Plotly one. No other themes are supported. The new theme is the default value, so if you are happy with it, you don’t need to include the parameter at all.
You can see the difference in presentation in the examples I’ve included here — in the image at the top of the article and the ones below.
I’ve taken these from the Plotly section of my article Streamlit from Scratch: Presenting Data where I’ve explored various ways of displaying data in addition to Plotly charts.
The top image is of course a line chart and you can see that the main difference is in the colour of the background and the choice of colours for the plot lines.
The various bar charts below show similar differences — the new theme is on the left, and the Plotly theme is on the right.
These grouped bars, above and below, show how the colour choices for the bars have changed.
The stacked bar on the right in the figure below was my attempt to change the default theme to something more to my liking within the limitations of Streamlit (i.e. the inability to use Plotly themes).
If you would like to see the code used to generate these images you will find a link to the code on the Streamlit from Scratch website.
As ever, thanks for reading, I hope it has been useful. You can find more resources on the Streamlit from Scratch website.