Custom fonts didn't work streamlit version 1.27 above

Plz, excuse my not fluent english writing.

  1. Are you running your app locally or is it deployed?

Locally

  1. If your app is deployed:
    a. Is it deployed on Community Cloud or another hosting platform?
    b. Share the link to the public deployed app.

Locally

  1. Share the link to your app’s public GitHub repository (including a requirements file).

see below

  1. Share the full text of the error message (not a screenshot).

see below

  1. Share the Streamlit and Python versions.

see below

I upgraded streamlit version from 1.26 to 1.27, 1.28, 1.29.

ver 1.26 custom fonts affects text elements
but, ver 1.27 above (to 1.29) custom fonts didn’t work at all

so I downgraded streamlit version from 1.29 to 1.26 now.

Is there any solution to activate custom fonts?

[style.css]

@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@500&display=swap');


html, body, [class*="css"] {
    font-family: 'Noto Serif KR','Noto Serif KR';
    font-weight: 900;
}

[apply css to app.py]

with open('style.css') as f:
        st.markdown(f'<style>{f.read()}</style>', unsafe_allow_html=True)

Hi @hojin,

Thanks for posting!

Instead of loading CSS from an external file, try including it directly in your Python code like so:

css = """
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@500&display=swap');

html, body, [class*="css"] {
    font-family: 'Noto Serif KR','Noto Serif KR';
    font-weight: 900;
}
"""

st.markdown(f'<style>{css}</style>', unsafe_allow_html=True)

I Tried with streamlit ver 1.29, but it didn’t work…

Can you share your repo/code so I can replicate the issue and find a solution for you?