How to use markdown text in st.progress's text?

[subaruspirit]

In st.progress’s text, the documentation states “The text can optionally contain Markdown and supports the following elements: Bold, Italics, Strikethroughs, Inline Code, Emojis, and Links”. But if I use st.markdown to structure the text, it will fail as the text area only accepts str or none. So how can I change the below progress_text to have bigger fonts, and orange color for example?

import streamlit as st
import time

progress_text = "Operation in progress. Please wait."
my_bar = st.progress(0, text=progress_text)

for percent_complete in range(100):
    time.sleep(0.1)
    my_bar.progress(percent_complete + 1, text=progress_text)

[tonykip]

Hi @subaruspirit,

Thanks for posting!

The st.progress function does indeed support markdown but is limited to the ones you highlighted above; Bold, Italics, Strikethroughs, Inline Code, Emojis, and Links

You can however use HTML tags within st.markdown to be hacky and achieve the font size you need. Here’s an example using your code above:

import streamlit as st
import time

progress_text = '<span style="font-size: 24px;">:orange[Operation in progress. Please wait.]</span>'
my_bar = st.progress(0)

st.markdown(progress_text, unsafe_allow_html=True)
for percent_complete in range(100):
    time.sleep(0.1)
    my_bar.progress(percent_complete + 1)

Output:

Let me know if this helps.

Happy Streamlit-ing!