Local custom font

Using Streamlit
6

@dnaura This is not recommended for anything but a locally running streamlit app with no internet access, but there’s a hack you can do that moves the font file to wherever streamlit is installed on your machine, and then references that. CSS won't render in deployed app (using components.html())

If you have internet access, it’s much better to reference a file somewhere on the internet, but in your case this should work.

Here’s a working script:

import shutil
from pathlib import Path

import streamlit as st


def move_font_files():
    STREAMLIT_STATIC_PATH = Path(st.__path__[0]) / "static"
    CSS_PATH = STREAMLIT_STATIC_PATH / "assets/fonts/"
    if not CSS_PATH.is_dir():
        CSS_PATH.mkdir()

    css_file = CSS_PATH / "FuturaCyrillicLight.woff"
    if not css_file.exists():
        shutil.copy("layout/FuturaCyrillicLight.woff", css_file)


st.markdown(
    """
    <style>
@font-face {
font-family: 'Futura PT Light';
font-style: normal;
font-weight: normal;
src: local('Futura PT Light'), url('assets/fonts/FuturaCyrillicLight.woff') format('woff');
}
html, body, [class*="css"] {
font-family: 'Futura PT Light', sans-serif;
}
</style>
""",
    unsafe_allow_html=True,
)

st.write("Test!")

if st.button("Move font files"):
    move_font_files()
2 Likes