Changing Button Color

Using Streamlit
#1

Hi there,

I’d love to know if there’s a way to change the red “highlight” when you however over a button.

image
image794×136 7.2 KB

Thank you in advance for the support.

#2

I have the same question! Following this post.

#3

Any update on this?

#4

Haven’t found a way to do this yet, but I’ll definitely post once I figure this out… Also, any help would still be appreciated.

#5

you can define any button appearance as you like:
replace the color code and you will get what you want.

import streamlit as st
st.markdown("""
div.stButton > button:first-child {
background-color: #00cc00;color:white;font-size:20px;height:3em;width:30em;border-radius:10px 10px 10px 10px;
}
.css-2trqyj:focus:not(:active) {
border-color: #ffffff;
box-shadow: none;
color: #ffffff;
background-color: #0066cc;
}
.css-2trqyj:focus:(:active) {
border-color: #ffffff;
box-shadow: none;
color: #ffffff;
background-color: #0066cc;
}
.css-2trqyj:focus:active){
background-color: #0066cc;
border-color: #ffffff;
box-shadow: none;
color: #ffffff;
background-color: #0066cc;
}
“”", unsafe_allow_html=True)
if st.button(“the notice you want to show”):
st.write(“content you want to tell”)