Fonts rendered different on different devices

support
1

Hello, community

I am new to Hugo and I was able to successfully host my webpage using Hugo with which I am very satisfied and happy.

There is just one issue regarding how fonts are being rendered. I am using the theme ezhil, and the fonts are getting rendered differently on my computer (left) than my mobile (right).

image
image.jpg1104Ă—478 154 KB

Has anyone else encountered this issue? How do I resolve it?
Thanks

2

Your theme defines “Ubuntu, sans serif” as default font. On your computer you might have that font, on your mobile not.

Solution: add this to your header (between <head> and </head>, before the stylesheets):

<link href="https://fonts.googleapis.com/css?family=Ubuntu:400,400i,700,700i&display=swap" rel="stylesheet">

You could do it properly with @import rules in your stylesheets, but the above will be a quicker fix.

Edit: On closer look there are several fonts missing from that package. See here:

1 Like
3

Fonts are not a part of Hugo. A browser looks locally for the wanted fonts. So diffrents OS have different fonts.

If you want the same font everywhere you must integrate a font to your static files and implement it i the CSS files.

1 Like