Google Fonts: arrivano le icone basate sul Material Design

La piattaforma Google Fonts ha ora un nuovo logo ispirato all'astrattismo ma non si tratta dell'unica novità proposta dal progetto, ancora più interessante è il fatto che il servizio mette a disposizione un set composto da oltre 2 mila icone liberamente utilizzabili tra le quali scegliere per i propri progetti online.

Stili grafici e Material Design

Gli stili grafici attualmente disponibili sono 5, "outline", "filled", "rounded", "sharp" e "two tone", a cui si aggiungono una serie di dimensioni e densità pronte per il download. Le specifiche di riferimento sono quelle del Material Design che è stato concepito dalla stessa Big G divenendo uno standard di fatto per le interfacce di tutti i suoi ecosistemi.

Il Material Design assicura un'elevata leggibilità e chiarezza in fase di rendering indipendentemente dalle dimensioni, nello stesso modo le icone sono state ottimizzate per qualsiasi tipo di display o risoluzione.

Tali icone, che vengono distribuite sotto licenza Apache in versione 2.0, sono disponibili in diversi formati e possono essere integrati in tipi di piattaforme e progetti differenti, sia che si tratti di applicazioni (per gli sviluppatori) che di prototipi o mockup (per i designer).

La material icon library fornisce quindi icone nei formati SVG e PNG, ideali per i progetti Web based, nelle varianti per Android e iOS e nella versione per le lingue di tipo RTL (right-to-left) sempre per Internet, il Robottino Verde e il sistema operativo di Apple. Vi è inoltre la possibilità di generare icone RTL tramite ImageMagick quando non si può effettuare il mirroring nel codice.

Installazione delle icone di Google Fonts

E' disponibile un archivio compresso in formato Zip del peso di circa 60 MB che consente di scaricare tutte le icone sul proprio dispositivo per lo sviluppo in locale, nello stesso modo si può procedere alla clonazione del repository Git che contiene il set completo delle icone nei vari formati implementati:

$ git clone https://github.com/google/material-design-icons/

Sono poi supportate le installazioni tramite il package manager Bower:

$ bower install material-design-icons

ed npm

$ npm install material-design-icons

Se invece si proferisce l'inclusione da CDN è possibile ricorrere al collegamento:

<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

che, esattamente come accade con i Google Web Fonts, fornisce il CSS corretto per l'attivazione delle Material Icons.