Ionic: Cómo importar y utilizar una fuente de texto

Cuando estás con un proyecto web o móvil los diseñadores se ponen creativos y deciden utilizar fuentes que no están en los dispositivos de manera estándar. En estos casos tenemos que importar fuentes externas.

¿Cómo lo hacemos? Pues muy sencillo,  en primer lugar necesitas el fichero de la fuente de texto en formato true-type (ttf).

Una vez tengas el fichero lo pegas en la carpeta que más te convenga, en mi caso yo suelo hacerlo en la carpeta assets/fonts, pero no tienes porque usar la misma que yo.

Una vez tienes la fuente en tu proyecto debes editar el fichero de estilos global: global.scss.

Vamos a imaginar que la fuente es Roboto.ttf.

Debes pegar el siguiente código:

@font-face {

    font-family: 'roboto';

    src: url('/assets/fonts/Roboto.ttf');

}

A partir de ahora ya puedes utilizar la fuente Roboto en cualquier hoja de estilos, por ejemplo para ponerla de fuente por defecto para el proyecto:

* {

    font-family: 'segoeui';

}

Espero que os sea de utilidad ^_^.