Variable font support

Post here questions and problems related to editing and publishing DITA content.
dorian_topsolid
Posts: 3
Joined: Wed Oct 19, 2022 4:51 pm

Variable font support

Post by dorian_topsolid »

Hello,
I'm currently trying and failing to use a variable font with Oxygen Chemistry. Is this feature supported?

Here's my code:

Code: Select all

@font-face {
  font-family: "OpenSans-Variable";
  src: url('resources/fonts/OpenSans-VariableFont_wdth,wght.ttf') format("truetype");
}

*[class ~= "uicontrol"], *[class ~= "keyword"] {
  font-family: "OpenSans-Variable" !important;   
  font-size: inherit;
  white-space: nowrap;
  font-weight: 650 !important;
}
I tried to use in-between values, as well as "regular" values of Open Sans (400, 500...) but neither is working.

Previously, I referenced the individual .ttf file for Bold, but I wanted to have a font-weight between Bold and Semi-Bold (650). Is this possible?

Kind regards,
Dorian
andrei_pomacu
Posts: 39
Joined: Mon Jul 25, 2022 11:18 am

Re: Variable font support

Post by andrei_pomacu »

Hi Dorian,

Variables fonts are a feature implemented in CSS Fonts Level 4 (More about variable fonts are found here https://developer.mozilla.org/en-US/doc ... able_fonts) which Chemistry does not support yet.
font-weight also needs to have one of this values: 100, 200, 300, 400, 500, 600, 700, 800, and 900 in order to work correctly.
Since we do not support variable fonts, the font that you want to use has to be static as well. So, in order to use a basic font-weight value it is mandatory to look into static folder.

Your URL should look something like:

Code: Select all

src: url('resources/fonts/static/OpenSans/OpenSans-Regular.ttf') format("truetype");
Regards,
Andrei
Post Reply