How to use ligatures and texture healing with webfont?

[oskarkrawczyk]

Wanted to add Monaspace as the base editor font in JSFiddle, but I cannot figure out how to use ligatures.

I think I've tried all solutions I know and could find on the web, none seem to force Monaspace to use ligatures.

This is the code I have, note that the font is the variable version converted to WOFF2 (but I did try the standalone WOFF2 provided in the package, as well as importing Truetype).

Now as to texture healing, I really cannot figure out if using it is even possible on the web – can someone confirm?

@font-face {
  font-family: "Monaspace Argon";
  font-style: normal;
  font-weight: 200 800;
  font-stretch: 100 125;
  font-display: swap;
  src: url("/font/MonaspaceArgonVarVF[wght,wdth,slnt].woff2") format("woff2");
  src: url("/font/MonaspaceArgonVarVF[wght,wdth,slnt].woff2") format("woff2") tech("variations");
  font-variation-settings:
    "wght" 300,
    "wdth" 100,
    "slnt" 0,
    "calt" 1,
    "ss01" 1,
    "ss02" 1,
    "ss03" 1,
    "liga" 1;
}

[Krzysztof-Cieslak]

The editor on https://monaspace.githubnext.com/ supports both ligatures and texture healing. I don't remember from top of my head what we've done there exactly, but I'm pretty sure you could just check styles using browser web tools.

[oskarkrawczyk]

@Krzysztof-Cieslak Thanks, one of these obvious things I didn't think of – both ligatures and texture healing sure do work there, and fail to work on my end so the issue is clearly on my end somewhere.

Thanks again for the speedy response.