Menu
I have custom-made web fonts used on my site. To style my rendering output, I used the following code:
//-webkit-text-stroke-width: .05px; //-webkit-text-stroke-color: white; -webkit-font-smoothing: antialiased; This works fine on Safari and Chrome (edges are sharper and lines are thinner). Is there any way of implementing the same style on Firefox and Opera?
790
If you're design is placing text onto a dark background then you have a good reason to look towards using the WebKit and Firefox prefixed font-smoothing options to make the text look lighter, but you should be warned that these only work on Mac and OSX and leaves the billions of other users with a sub-standard view.
Open the Control Panel. Double-click the Display icon. In the Display menu, click the Effects tab, and then check the box on smooth edges on-screen fonts. After that, click Apply, and then click Ok.
The font-smooth CSS property controls the application of anti-aliasing when fonts are rendered. This feature is non-standard and is not on a standards track. It depends on the browser used and the system specifications; thus, it may not work for every user.
Sometimes abbreviated as AA, anti-aliasing is a term used to describe the software process of making the edges of graphics objects or fonts smoother. Accomplished by adding additional pixels in-between the edges of an object and its background.
As Opera is powered by Blink since Version 15.0 -webkit-font-smoothing: antialiased does also work on Opera.
Firefox has finally added a property to enable grayscaled antialiasing. After a long discussion it will be available in Version 25 with another syntax, which points out that this property only works on OS X.
-moz-osx-font-smoothing: grayscale; This should fix blurry icon fonts or light text on dark backgrounds.
.font-smoothing { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } You may read my post about font rendering on OSX which includes a Sass mixin to handle both properties.
121
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
