How to render thin fonts more smoothly in CSS3 with HTML?

To render thin fonts more smoothly, use −

text-rendering: optimizeLegibility !important;
-webkit-font-smoothing: antialiased !important;
-moz-osx-font-smoothing: grayscale !important;

For Google Chrome, use −

-webkit-font-smoothing:antialiased !important;

You can enhance the performance like this −

text-rendering: auto
text-rendering: optimizeSpeed
text-rendering: optimizeLegibility
text-rendering: geometricPrecision
text-rendering: inherit

Samual Sam

Learning faster. Every day.

Updated on: 25-Jun-2020

193 Views

Kickstart Your Career

Get certified by completing the course

Get Started