'Font adds a shade to the letter "W" when made it bold

I am using "FivoSans" font in my website and spotted a strange behaviour of the font when the added some font-weight to the font.

The font "FivoSans" is a font that I received from the client. And I added the font to the site using below code.

/* Fontface Imports */
@font-face {
    font-family: "FivoSans";
    src: url(/content/theme/fonts/FivoSans/FivoSans- Regular.otf) format("opentype");
}

The letter "W" has a little shade (or does not gets the font-weight added properly) when font-weight goes above 400.

enter image description here

Notice the letter "W" in News.

Following is the capture of inspect element in Google Chrome. enter image description here

Is there a way to fix this and does anyone have an idea why this is happening?

cssfontsdiscord


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source

Related Questions