I built a font picker in my compose app. On Deskt...

# compose

[Alex Styl]

I built a font picker in my compose app.

On Desktop it works great, but on web (JS) a lot of fonts are rendered as squares.

Am I missing something or is this some sort of a bug?

[Samuel]

Hmm maybe you need to bundle your fonts as resources? - You can also add the fonts to be loaded asynchronously in the HTML side. What does your browser network tab say?

[Alex Styl]

I want to provide a font picker with fonts from google fonts. all fonts are 2gb so that's not an option.

I am loading them asynchronously btw. i download the font using ktor, then turn that into a Font() and i create a FontFamily that i forward to my Text()

[Alex Styl]

ok i just realised that the fonts i download are .woff2. that doesnt seem to be working on web, but it works on desktop

[Samuel]

So here is the official font picker https://fonts.google.com/

If you look carefully you can see that they are woff and each font is loaded in a seperate GET request

[Samuel]

Screenshot 2024-10-10 at 1.56.22 pm.png

[Alex Styl]

how does that work though and does compose web support it?

I tested downloading one of the woff files and load it via compose resources. it works on desktop but doesnt work on web

[wwalkingg]

It should be operational, as Font supports being constructed from a ByteArray.

[wwalkingg]

I have tested that compsoe web supports woff2 too.
> test use https://raw.githubusercontent.com/IlysvlVEizbr/via-font/master/xwFasmart.woff2