arrowtype / recursive

Recursive Mono & Sans is a variable font family for code & UI
https://recursive.design
SIL Open Font License 1.1
3.15k stars 51 forks source link

It is possible to separate roman and italic variable font file? #526

Open ottta opened 8 months ago

ottta commented 8 months ago

Is your feature request related to a problem? Please describe. This issue's about variable font on web, my experience using variable fonts in web development especially in front-end area really makes the job easier, because I only need to load one or maybe two files for several styles includes italic to avoid waterfall data fetching. Slanted "slnt" axis doesn't work on default html text formatting tags such a <i /> and <em /> even though by default these tags have font-style: italic; on any browser.

Describe the solution you'd like As a GF Guide recommendation to separate roman and slanted (to be italic)

Describe what you've tried so far I never touch the masters font file, but for temporary solution for web development is manually adding:

i, 
em {
    font-variation-settings: "slnt" -15;
}

or in the modern environment like TailwindCSS

.italic {
    font-variation-settings: "slnt" -15;
}

However it breaks the native html text formatting tags and TailwindCSS experience for entire web pages

arrowtype commented 8 months ago

Hey, thanks for asking! Yeah, I should split the variable font for web, and add that to the release. It is annoying browser support is so bad, but it is what it is.

For now, you can split it on your own in two ways:

  1. Use the app Slice for a GUI
  2. Use the FontTools Instancer in the terminal (or via Python).
ottta commented 8 months ago

Glad to hear if you willing to separate roman and italic, and I will let this issue open until the upcoming release, is it ok right?

arrowtype commented 6 months ago

Hey, sorry I missed replying to this earlier! Yeah, let’s leave this open until the next release (hoping to do a small one soon).