Add dataframe background color control

[Christian]

i want to be able to control the background color of my streamlit dataframes. The new theme options are great, but the standard st.dataframes have a transparent background, this can sometimes conflict with design preferences.

from this:

to this: (shadcn sample table)

[coffeeforkevin]

This answer assumes you’re setting hide_index=True in st.dataframe() as the style options don’t apply to the index column.

As per the Streamlit docs, you can pass a Pandas Styler to the dataframe to apply styles to it. In your instance you can do something like the following to give it a white background.

df.style.set_properties(**{'background-color': 'white'})

Passing this to st.dataframe as follows gives you the look you’re expecting whilst maintaining any background colour set to the header in you config.toml file.

st.dataframe(df.style.set_properties(**{'background-color': 'white'}), hide_index=True)

The one thing to note is that the background colour will not apply to the scollbars of the dataframe. If you want these to match the colour set in set_properties then you’ll need to use the following custom CSS in st.html and set the colour as the same value.

st.html("""
    <style>
        [data-testid="stDataFrameResizable"] {
            background-color: white;
        }
    </style>
""")

Either way, the scrollbar overlaps the header so it will show as a different colour next to the header so it’s up to you to decide if you want it to match the standard background colour or the colour you set for the dataframe.

Result without adding the custom CSS is shown below.

With custom CSS.