Font not clear on cent counter on Windows about overtones

[meszaros-lajos-gyorgy]

You could try setting font smoothing:

-webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;

[meszaros-lajos-gyorgy]

Or you can try reordering the urls in your @font definition to have the svg files on the top. The browsers will load the urls from top to bottom and will stop at the first valid url and not choose others, even if that means skipping a better alternative.

[sunyatasattva]

Hey @meszaros-lajos-gyorgy thank you for your tips. It was specifically a Windows thing, so unfortunately those properties didn't do the trick (but thanks for sharing as I didn't know them before).

I did not very well understand your suggestion on the @font definition, do you mind expanding on that? In any case, I have solved the issue, it was basically just a sub-pixel anti-aliasing issue: Windows has been known for its horrendous typography since forever, alas!

[meszaros-lajos-gyorgy]

I now see, that you load the font through google. I use this style for my fonts:

@font-face {
	font-family: 'monochord';
	src: url('../fonts/monochord/monochord.eot?67961079');
	src: url('../fonts/monochord/monochord.eot?67961079#iefix') format('embedded-opentype'),
	   url('../fonts/monochord/monochord.woff2?67961079') format('woff2'),
	   url('../fonts/monochord/monochord.woff?67961079') format('woff'),
	   url('../fonts/monochord/monochord.ttf?67961079') format('truetype'),
	   url('../fonts/monochord/monochord.svg?67961079#monochord') format('svg');
	font-weight: normal;
	font-style: normal;
}

The browser reads the urls from top to bottom and stops as soon as it finds any usable format as far as I know. Reordering the urls might bring improvement to some browsers.