Hello everyone, hope you’re doing great!!
I’m adapting the Streamlit theme to match my app colors.
I’ve looked the Streamlit Design System figma and understood the theme colors, now the only colors left I’d like to find are the chart colors.
Is there some place where I can find them? I mean the definition of gray50, gray100 and so on.
Hey there, thanks for your question and for being part of the Streamlit community! 
Customizing your app’s theme is a great way to make it feel unique. My understanding is that Streamlit’s chart colors—like gray50, gray100, etc.—aren’t directly exposed in the Python API, but you can define or override chart colors in your .streamlit/config.toml file using the chartCategoricalColors and chartSequentialColors options. The default color values (including grays) are listed in the config.toml theme documentation, but specific names like “gray50” or “gray100” are not directly mapped in the config; instead, you use hex codes.
For reference, the default categorical color palette for charts in the light theme is:
chartCategoricalColors = [
"#0068c9", "#83c9ff", "#ff2b2b", "#ffabab", "#29b09d",
"#7defa1", "#ff8700", "#ffd16a", "#6d3fc0", "#d5dae5"
]
You can set your own colors here, using any hex codes you like. If you want to match the Figma design system’s gray shades, you’ll need to manually add their hex values to your config. More details and the full list of theming options are available in the Streamlit theming docs and color/border customization guide.
Sources:
Thanks for your response! What I’d like is to find the color palette in figma of the colors used in the chart, that way I can adapt them to my needs in my own figma.
I’ve seen that colors like blue-40, red-80 and so on are used for charts but in the figma variables they are not defined… maybe they are coming from another file, I’d like to see those.
I did find the colors in the Github source code!
This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.