Hemsida » Toolkit » 10 Användbara och fria teckensymboler du bör lägga märke till

    10 Användbara och fria teckensymboler du bör lägga märke till

    När allt fler enheter antar högupplösta skärmar blir teckensnitt ikoner det populära valet att anta. Det kan ändras utan att kompromissa med kvalitet och anpassningsbar via CSS. Vi kan enkelt ändra färg, storlek och till och med animera typsnitt ikoner med CSS3. Plus det är upplösningsoberoende vilket gör att den ser skarp ut på vilken skärmdensitet som helst.

    FontAwesome är överlägset en av de mest populära typsnittskällorna, med en stor samling ikoner. Men det är högst onödigt att ladda ner hela samlingen när du behöver använda bara några. Här är 10 alternativa källor till väl utformade teckensnitt ikoner att jag hoppas att du skulle hitta användbar ibland för att bygga dina nästa stora webbplatser och appar i stället för FontAwesome.

    StackIcons

    StackIcons är typsnitt ikoner för över 60 moderna sociala varumärken. Den levereras med CSS, så att du kan ställa in din typsnitt i många behållarformer. Du kan få dina sociala varumärkesikoner i cirklar, kvadrater eller med rundade kanter. Du kan också färga ikonerna i mer än en färg, vilket ger dig mer realistiska varumärkeskalor.

    Licens: SIL Öppna teckensnitt och MIT

    Twemoji Awesome

    Twemoji är ett open source-emoticon-projekt från Twitter. Elle Kasai har portat det till en fontikon som heter Twemoji Awesome. Alla klassnamn för att visa ikonerna är desamma som Twemoji Cheat Sheet, men du måste använda ett streck i stället för ett understreck, det är allt. Här är ett exempel på hur vi lägger till hatching_chick ikon:

      

    Licens: MIT och CC-BY för Emoticon-grafiken

    Teckensnitt Diao

    Font Diao är en samling typsnitt ikoner från populär webbplats eller företag baserat i Kina som Alibaba, Alipay, WeChat, Xiaomi och Weibo. Teckensnittet kan komma till nytta när du bygger wesbites utsedda för Kina fastlandet publiken som förmodligen är bekant med denna typsnitt.

    Licens: Offentlig licens

    Socialicious

    Socialicious är ett typsnitt som uteslutande är byggt för populära sociala webbplatser som Facebook, Twitter och Instagram. Teckensnittet är byggt för att fungera bra med Bootstrap. Här är en exempelkod för att skapa en knapp med Bootstrap .BTN klass i samband med typsnittsklasser.

       Anslut med Linkedin  

    Licens: MIT-licens.

    Octicons

    Octicons är en uppsättning typsnitt ikoner som presenteras av GitHub, så att du kan använda samma ikon som används av GitHub på ditt projekt. Det finns mer än 170 ikoner redo att söka på ditt nästa projekt.

    Betalnings typsnitt

    Om du använder en betalningsgateway kanske du vill ta tag i dessa teckensnittikoner. Paketet innehåller 95 sömnikoner som är populära betalningsmetoder eller gateways som Visa, American Express och mer.

    Licens: SIL OFL 1.1

    Android ikoner

    Detta är ikonuppsättningen skapad av Opoloo, tidigare känd som Android-community. Den innehåller 250 fantastiska ikoner i 5 storlekar och 14 färger med inbyggda Android-ikoner.

    Licens: Attribution-ShareAlike 4.0 International

    DevIcons

    DevIcons är en uppsättning typsnitt ikoner handgjorda av Theodore Vorillas. Den innehåller 85 symboler och logotyper av välbekanta utvecklingsapplikationer som GitHub-ikonen, Gulp-ikonen, Angular-ikonen och många andra.

    Licens: MIT

    Öppna ikoniska

    Open Icon innehåller 223 ikoner som är klara att använda med bootstrap, en ram eller ditt eget stilark. Teckensnittstorleken är liten, bara 12,4 kb, vilket är ungefär ett fjärdedel av det du hittar i FontAwesome. Den häftiga saken här är, dessa ikoner kan skalas ner till 8px.

    Licens: SIL.

    Material Design Iconic Font

    Det finns 15 kategorier av Google Material Design-inspirerade typsnittikoner i detta paket. För att använda dem, bara installera Material-Design-Iconic-Font.ttf, använd sedan detta cheatsheet. Kopiera klistra in ikonerna (inte unicode) i ditt projekt. Du kan förstora ikonerna, ge den gränser, snurra, rotera eller vända den med CSS.

    Licens: Attribution-ShareAlike 4.0 International

    Läs nu: 50+ Gratis Symbol Fonter För Webbdesigners