Rendering of custom Font is "bloated" in Chrome Browser

Hello everybody.

I use the DAWN Theme and the method of using custom fonts from here

https://ezfycode.com/blog/add-custom-fonts-to-shopify

  • which I found in a few other Posts here in the forum.

The font is displayed correctly everywhere except in Chrome browser.

There it has a “bloated” look, like there’s some extra boldness happening on the font.

Before the technique above I used the standard technique with “@font-face […]” in “base.css”.

I had the same bloated font results.

I assume it has something to do with how Chrome renders the font

but I am not an expert in web matters.

Is there a way to improve the displaying of the font in Chrome browsers?

Or another way to use the font besides inserting an image of the headline?

Many thanks in advance for the answers.

Hey @avoocadoo ,

Can i have the link to your store please? A preview link if the theme is yet to be published

Hey @ThePrimeWeb ,

sure. The link is

https://47450f.myshopify.com/

Hey @avoocadoo ,

This should fix the issue :blush:

Go to your theme’s “Edit Code” Option, then in the search bar type “theme.liquid”
Below the tag “” tag paste the following. Screenshot attached for reference.


Screenshot is for reference only, the correct code to paste is the one shown above.

1 Like

Wow, thank you very much! That’s wonderful.