Loading custom fonts/assets in Gradio

đź”’ Gradio
1

Hi, I’d like to add custom assets/fonts to gradio. These font files are placed on my server, how can I allow gradio to load these files/fonts?

example css line: @font-face { font-family: “MYFont”; src: url(“Fonts/MY_TheSans_Web/MyTheSans-Light.eot”);

2

Hi @husmani !

I believe we allow loading Google Fonts via the Theme class but I’m not sure about local files. @abidlabs @pngwn @aliabid94 do you know?

3

If you are using custom CSS, you should be able to reference the font file via a URL like this:

@font-face { font-family: “MYFont”; src: url(“/file=Fonts/MY_TheSans_Web/MyTheSans-Light.eot”);

Notice the “/file=” at the beginning of the URL. Starting with Gradio 4.0, you’ll also need to specify that Gradio should allow access to files in your working directory. You can do so with by setting the allowed_paths parameter in launch() to be ["Fonts/MY_TheSans_Web/MyTheSans-Light.eot"]

1 Like