Kotisivu » Toolkit » 10 Hyödyllisiä ja ilmaisia ​​kirjasinkuvakkeita, joita kannattaa varata

    10 Hyödyllisiä ja ilmaisia ​​kirjasinkuvakkeita, joita kannattaa varata

    Koska yhä useammat laitteet ottavat käyttöön teräväpiirtokuvia, kirjasinkuvakkeet ovat tulossa suosittu valinta. Se on mitoitettavissa muuttamatta laatua ja muokattavissa CSS: n kautta. Voimme helposti muuttaa CSS3: n väriä, kokoa ja jopa animaatioita. Lisäksi se on resoluutiosta riippumaton joka tekee sen näyttävästä terävästä näytön tiheydestä.

    FontAwesome on ylivoimaisesti yksi suosituimmista fonttilähteistä. Mutta koko kokoelman lataaminen on erittäin tarpeetonta, kun tarvitset vain muutamia. Tässä ovat 10 vaihtoehtoista lähteitä hyvin muotoilluista fonttikuvioista Toivon, että löytäisitte hyödyllistä joskus rakentaa seuraavan suuren sivustosi ja sovelluksesi FontAwesomin sijasta.

    StackIcons

    StackIcons ovat fonttikuvakkeita yli 60 modernille yhteiskuntamerkille. Sen mukana tulee CSS, jonka avulla voit suunnitella fonttisi monissa säiliömuodoissa. Voit saada sosiaalisen tuotemerkin kuvakkeet ympyröissä, neliöissä tai pyöristetyillä reunoilla. Voit myös värittää kuvakkeita useammassa kuin yhdessä värissä, mikä antaa sinulle realistisempia tuotemerkin värejä.

    lisenssi: SIL Open Font ja MIT

    Twemoji Awesome

    Twemoji on Twitterin avoimen lähdekoodin hymiöprojekti. Elle Kasai on siirtänyt sen fontti-kuvakkeeseen, jota kutsutaan Twemoji Awesome. Kaikki kuvakkeiden näyttämiseen tarvittavat luokkien nimet ovat samat kuin Twemoji Cheat Sheet, mutta sinun on käytettävä viivaa alaviivan sijasta. Tässä on esimerkki siitä, miten lisätään hatching_chick kuvake:

      

    Lisenssi: MIT ja CC-BY hymiögrafiikkaa varten

    Fontti Diao

    Font Diao on kokoelma kirjasinkuvakkeita suosituilta verkkosivustoilta tai Kiinassa sijaitsevilta yrityksiltä, ​​kuten Alibaba, Alipay, WeChat, Xiaomi ja Weibo. Kirjasin saattaa tulla käyttökelpoiseksi, kun rakennat wesbitejä, jotka on tarkoitettu Kiinan mantereen yleisölle, jotka todennäköisesti tuntevat tämän nimen.

    Lisenssi: Julkinen käyttöoikeus

    Socialicious

    Sosiaalinen on fontti, joka on rakennettu yksinomaan suosituille sosiaalisille sivustoille, kuten Facebook, Twitter ja Instagram. Kirjasin on suunniteltu toimimaan hyvin Bootstrapilla. Tässä on esimerkkikoodi, jolla voit luoda painikkeen Bootstrapilla .btn luokka yhdessä fonttiklassien kanssa.

       Yhdistä Linkediniin  

    Lisenssi: MIT-lisenssi.

    Octicons

    Octicons on joukko GitHubin esittämiä kirjasinkuvakkeita, joiden avulla voit käyttää samaa kuvaketta, jota GitHub käyttää projektissasi. Seuraavassa projektissa on valmiina käytettäväksi yli 170 kuvaketta.

    Maksutapa

    Jos käytät maksuyhdyskäytävää, haluat ehkä ottaa nämä fonttikuvakkeet. Paketti sisältää 95 unia kuvaketta, jotka ovat suosittuja maksutapoja tai yhdyskäytäviä, kuten Visa, American Express ja paljon muuta.

    Lisenssi: SIL OFL 1.1

    Android-kuvakkeet

    Tämä on Opoloon luomaa kuvakokonaisuutta, joka tunnetaan aiemmin nimellä Android-yhteisö. Se sisältää 250 mahtavaa kuvaketta 5 koossa ja 14 värillistä Android-kuvaketta.

    lisenssi: Attribution-ShareAlike 4.0 International

    DevIcons

    DevIcons on joukko kirjasinkuvakkeita, joita Theodore Vorillas on käsityönä. Se sisältää 85 tunnusta ja tunnusta tutuista kehitysohjelmista, kuten GitHub-kuvakkeesta, Gulp-kuvakkeesta, kulmakuvakkeesta ja monista muista.

    Lisenssi: MIT

    Avaa Ikoni

    Avaa kuvake sisältää 223 kuvaketta, jotka ovat valmiina käytettäväksi bootstrapin, kehyksen tai oman tyylitaulukon kanssa. Kirjasinkoko on pieni, vain 12,4 Kb, mikä on noin neljännes FontAwesome-ohjelmasta. Viileä asia tässä on, nämä kuvakkeet voidaan skaalata 8 pikseliin.

    Lisenssi: SIL.

    Materiaalisuunnittelu Iconic Font

    Tässä paketissa on 15 Google-materiaalisuunnittelusta inspiroitua fonttikuvaketta. Jos haluat käyttää niitä, asenna Material-Design-Iconic-Font.ttf ja käytä sitten tätä cheatsheet. Kopioi kuvakkeet (ei unicode) projektiisi. Voit suurentaa kuvakkeita, antaa sille reunoja, pyörittää, kiertää tai kääntää sen CSS: llä.

    lisenssi: Attribution-ShareAlike 4.0 International

    Nyt lukee: 50+ ilmaisia ​​symbolimerkkejä Web-suunnittelijoille