Using ASCII terminal colors

[jamesbraza]

I am using Python 3.11 with Streamlit 1.28.1.

I am also using ASCII codes for terminal graphics: Terminal Colors | Chris Yeh

This color coding comes from LangChain: https://github.com/langchain-ai/langchain/blob/v0.0.333/libs/langchain/langchain/utils/input.py#L4-L32

Is there some UI component for text in Streamlit that supports ASCII terminal colors?

[dataprofessor]

Hi @jamesbraza

You can use st.markdown()'s built-in color support.

Here’s an example:

st.markdown('''
    :red[Streamlit] :orange[can] :green[write] :blue[text] :violet[in]
    :gray[pretty] :rainbow[colors].''')

Another approach is to use CSS styling to color text (use this within st.markdown:

<p style="color:red">This is a paragraph.</p>

Hope this helps!

[jamesbraza]

Hi @dataprofessor thanks for the response and yes I am aware of the colorization capability of st.markdown. However, that does not use ASCII color code syntax.

Perhaps it would make sense for a function that can automatically convert ASCII terminal color strings to Streamlit colorized strings for st.markdown. If anyone feels like making that, feel free to share a GitHub Gist link here.

[mathcatsand]

As far as I know, the answer is “not easily.”

I see some convenient spans when I render:

st.code("\x1b[31mtest\033[0ming",language="bash")

If I inspect it, I see:

<code class="language-bash" style="white-space: pre;">
    <span>e</span>
    <span class="token token punctuation">[</span>
    <span>31mteste</span><span class="token token punctuation">[</span>
    <span>0ming</span>
</code>

Which is to say, there may be a JavaScipt/CSS solution to manually parse and modify the text. It would be a bit of work, though.