How can I use a font in my Dioxus project

[ifsheldon]

Hi! I'm developing my website with Dioxus. I want to use a local font file. How can I use it? I know I can simply use asset! to include the file, but how can I reference it in the code and CSS file? Has anyone tried that before?

[ealmloff]

If you move your font into your asset folder (set in your Dioxus.toml), then dioxus will copy and serve the font into the /assets folder directly without mangling the name

[ifsheldon]

Thanks! So that means I can refer the fonts in CSS as usual? like

@font-face {
  font-family: "Agustina Regular";
  font-style: normal;
  font-weight: normal;
  src: local("Agustina Regular"),
    url("/assets/fonts/Agustina.woff") format("woff");
}

set in your Dioxus.toml

I didn't see the related setting in the documentation? Did I missing anything?

[ealmloff]

The asset dir is documented here https://dioxuslabs.com/learn/0.6/CLI/configure#application-

[ifsheldon]

Thanks a lot!