Fontello & Icon Font-smoothing scaling issues anti-aliased

Oh so I have been using Fontello to create SVG’s to an icon typeface > http://fontello.com/

Key Learnings:

– Font rendering on iOS is superior and poor on Windows
– Adding this will improve Chrome: {-webkit-font-smoothing: subpixel-antialiased }

See example click here

– Adding this will improve Firefox: { text-rendering: optimizeLegibility; }

Also try { font-weight: 700 or bold; or try font-size: 110-12-%; }

– Icon rendering on Chrome needs this code added to the CSS:

/* Chrome hack: SVG is rendered more smooth in Windows. 100% magic, uncomment if you need it. */
/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */

@media screen and (-webkit-min-device-pixel-ratio:0) {
@font-face {
font-family: ‘realestate’;
src: url(‘../font/realestate.svg?17983000#agentbox’) format(‘svg’);
-webkit-font-smoothing: subpixel-antialiased;
text-rendering: optimizeLegibility;
}
}

Goodluck, WBvG