Lato font not available in App Embed block

[arnav98]

Hi,

I'm trying to add Lato font inside my app embed block using the old React + Node template (/extensions/[extension-name]/assets/Lato.woff2).

After that I'm giving the font-family as "Lato" in my CSS but it is not reflecting inside my UI.

How do I actually include this font? Thanks!

[romartiny]

If you have downloaded this font, you need to do the following. Import this font into your css/scss file (ex. style.css/style.scss). Be sure to write the format, as formats are different.

@font-face {
font-family: 'Lato';
src: url('/extensions/[extension-name]/assets/Lato.woff2') format('woff2');
}

Next, add the font on the body. The second font is needed for loading if the main font doesn't work. You can add any other pre-installed font if you wish.

body {
font-family: 'Lato', sans-serif;
}