Micon - Windows 10 -kuvakkeen fontti web-suunnittelijoille

redesign for Windows 10 mukana oli monia uusia ominaisuuksia ja täysin uusi ulkoasu. Yksi suurimmista muutoksista tuli kuvakkeen tyyliin, erityisesti verrattuna Windows 7: een ja XP: hen.

Kiitos Micon, nyt voit tuo Win10-tyyliset kuvakkeet suoraan sivustoosi.

Tämä kuvake paketti tulee ikoni-fonttina ja se on julkaistaan ​​ilmaiseksi GitHubin kautta. Tärkein repo sisältää asennustiedot, mutta Miconin kotisivu sisältää kaikki kuvakkeet näytössä, jossa on asianmukaiset luokkien nimet.

Todellinen verkkosivuston rakenne seuraa samanlaista muotoa kuin Font Awesome. Sinä pystyt selaa kaikkia kuvakkeita ja napsauta mitä tahansa niistä saadaksesi lisätietoja uudelta sivulta.

Ota esimerkiksi tämä akun latauskuvake, jossa käytetään akkua ja pieni latauspistoke. Saat a kuvakkeen esikatselu eri kokoisina, kera sen CSS-kuvaluokka, tässä tapauksessa mi-BatteryCharging10.

Tämä kuvakejoukko toimii myös kuten Font Awesome, missä voit upota kuvakkeet suoraan HTML-koodiin. Tämän akkukuvakkeen koodinpätkä toimii samalla tavalla:

Se on erittäin helppo aloittaa, vain kopio Micon CSS-tyylitaulukosta ja joitakin perustiedot etupään kehityksestä.

Tutustu asetussivu oppia lisää. Todella, sinun tarvitsee vain lataa kopio Micon-paketista GitHubilta ja sisällyttäkää kyseinen tyylisivu (sekä oikeat kuvakkeet) sivullesi. Sieltä vain viittaamalla luokkien nimiin kuten edellä ja olet hyvä mennä.

Koska tämä projekti on avoimen lähdekoodin, olet vapaasti käyttää näitä kuvakkeita minkä tahansa projektin, henkilökohtaisen tai kaupallisen. Ja voit jopa tee oma tiedosto noudattamalla Micon GitHubin rakennusohjeita. Näin voit pakkaa vain haluamasi kuvakkeet fonttitiedostoihin ja pienentää tiedoston kokoa.

Kaiken kaikkiaan olen todella vaikuttunut erilaisia ​​kuvakkeita ja helppo asentaa. Voit löytää paljon esimerkkejä verkkosivuilla ja jopa animoituja kuvakkeita Esimerkkisivulla, joka sisältää koodinpätkät.

Nämä kuvakkeet ovat jopa toimi hyvin Bootstrapin avulla, niin sinä voit yhdistää se BS3 / BS4-kehyksen kanssa joitakin todellisia mukautettuja asetteluja.

Lataa ilmainen tekijänoikeus Miconin kotisivulta ja katso, miten voit työskennellä näissä Windows 10 -kuvakkeissa seuraavaan suunnitteluun.