Un font icon es usar fonts como iconos. Ya que los fonts son vectoriales, es una alternativa atractiva a usar imágenes. Principalmente para garantizar la buena visibilidad en dispositivos con retina display.
Pero, hay un problema con la manera como los navegadores muestran los fonts icons en una Mac.
Por default, usan un método de suavizado llamado subpixel, que tiende a engrosar los detalles y, en ciertos casos, quitarle usabilidad al icon. Es necesario indicar que usen el método de suavizado simple, o grayscale.
Y hay que hacerlo tanto para Chrome (Webkit) como para Firefox:
Y si se necesitara volver al método por default:
Pero, hay un problema con la manera como los navegadores muestran los fonts icons en una Mac.
Por default, usan un método de suavizado llamado subpixel, que tiende a engrosar los detalles y, en ciertos casos, quitarle usabilidad al icon. Es necesario indicar que usen el método de suavizado simple, o grayscale.
Y hay que hacerlo tanto para Chrome (Webkit) como para Firefox:
.selector_de_font_icon {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
Y si se necesitara volver al método por default:
.selector_de_no_font_icon {
-webkit-font-smoothing: subpixel-antialiased;
-moz-osx-font-smoothing: auto;
}