10 nuttige en gratis lettertypepictogrammen die u moet markeren

Omdat steeds meer apparaten high-definition schermen gebruiken, worden lettertypepictogrammen de populaire keuze om te adopteren. Het is resizenbaar zonder de kwaliteit in gevaar te brengen en kan via CSS worden aangepast . We kunnen de pictogrammen voor kleur, grootte en zelfs animatie van lettertypen eenvoudig wijzigen met CSS3. Bovendien is het resolutieonafhankelijk waardoor het er helder uitziet op elke schermbelichting.

FontAwesome is verreweg een van de meest populaire fontbronnen, met een enorme verzameling iconen. Maar het is overbodig om de hele verzameling te downloaden als u er maar een paar wilt gebruiken. Hier zijn 10 alternatieve bronnen van goed ontworpen lettertypepictogrammen waarvan ik hoop dat je het soms handig zou vinden om je volgende geweldige websites en apps te bouwen in plaats van FontAwesome.

StackIcons

StackIcons zijn lettertypepictogrammen voor meer dan 60 moderne sociale merken. Het wordt geleverd met CSS, zodat u uw lettertype in vele containervormen kunt stylen. U kunt uw sociale merkpictogrammen in cirkels, vierkanten of met afgeronde hoeken krijgen. U kunt de pictogrammen ook in meer dan één kleur inkleuren, waardoor u realistischere merkkleuren krijgt.

Licentie : SIL Open Font en MIT

Twemoji geweldig

Twemoji is een open source emoticon-project van Twitter. Elle Kasai heeft het geport naar een lettertypepictogram genaamd Twemoji Awesome . Alle klasnamen om de pictogrammen weer te geven zijn hetzelfde als de Cheem Sheet van Twemoji, maar u moet een streepje gebruiken in plaats van een onderstrepingsteken, meer niet. Hier is een voorbeeld van hoe we het pictogram hatching_chick toevoegen:

Licentie: MIT en CC-BY voor de grafische afbeeldingen van Emoticon

Lettertype Diao

Lettertype Diao is een verzameling lettertypepictogrammen van populaire websites of bedrijven in China, zoals Alibaba, Alipay, WeChat, Xiaomi en Weibo. Het lettertype kan van pas komen als je wesbites aan het maken bent die zijn aangewezen voor het Chinese vastelandpubliek, die waarschijnlijk bekend zijn met dit specifieke lettertype.

Licentie: openbare licentie

Socialicious

Socialicious is een lettertype dat exclusief is gebouwd voor populaire sociale websites zoals Facebook, Twitter en Instagram. Het lettertype is gebouwd om mooi te werken met Bootstrap. Hier is een voorbeeldcode om een ​​knop te bouwen met de Bootstrap .btn klasse in combinatie met lettertypeklassen.

  Maak verbinding met Linkedin 

Licentie: MIT-licentie.

Octicons

Octicons is een verzameling lettertypepictogrammen gepresenteerd door GitHub, zodat u hetzelfde pictogram kunt gebruiken als door GitHub in uw project wordt gebruikt. Er zijn meer dan 170 pictogrammen klaar om op uw volgende project van toepassing te zijn.

Betalingsletter

Als u een betalingsgateway gebruikt, wilt u misschien deze lettertypepictogrammen gebruiken. Het pakket bevat 95 slaappictogrammen met populaire betalingsmethoden of gateways zoals Visa, American Express en meer.

Licentie: SIL OFL 1.1

Android-pictogrammen

Dit is de icon set gemaakt door Opoloo, voorheen bekend als de Android-community. Het bevat 250 geweldige pictogrammen in 5 formaten en 14 kleuren native Android-pictogrammen.

Licentie : Attribution-ShareAlike 4.0 International

DevIcons

DevIcons is een verzameling lettertype-iconen, handgemaakt door Theodore Vorillas. Het bevat 85 symbolen en logo's van bekende ontwikkelingsapplicaties zoals het GitHub-pictogram, het Gulp-pictogram, het hoekige pictogram en vele andere.

Licentie: MIT

Open iconisch

Open Icon bevat 223 iconen klaar voor gebruik met bootstrap, een framework of je eigen stylesheet. De lettergrootte is klein, slechts 12, 4Kb, wat ongeveer een kwart is van wat je kunt vinden in FontAwesome. Het leuke is dat deze pictogrammen kunnen worden verkleind tot 8px.

Licentie: SIL.

Materiaalontwerp Iconisch lettertype

Er zijn 15 categorieën door Google Material Design geïnspireerde lettertypepictogrammen in dit pakket. Gebruik Material-Design-Iconic-Font.ttf om ze te gebruiken en gebruik vervolgens deze cheatsheet. Kopieer de pictogrammen (niet de unicode) in uw project. Je kunt de pictogrammen vergroten, randen geven, draaien, draaien of omdraaien met CSS.

Licentie : Attribution-ShareAlike 4.0 International

Nu lezen: 50+ gratis symboollettertypen voor webontwerpers

Bouw Modals met Pure CSS met CSS Modal

Bij webdesign moet je een goede contentorganisatie hebben. Dit helpt de gebruikers leesbaardere en functionele informatie te geven. U kunt dit doen door een nette en opgeruimde lay-out op de website te maken. Om de inhoud te ordenen, zijn er veel interface-elementen en -structuren die u kunt gebruiken, en modale dialoog is er een van

(Technische en ontwerptips)

Hoe een nieuw jaar te beginnen

Ik ga helemaal eerlijk tegen je zijn. Dit is een schrijfuitdaging. Het is een van die martelwerktuigen die schrijvers zichzelf opdringen om hen te helpen betere inhoud te schrijven. Voor ontwerpers is het zoiets als beperkingen. Mijn uitdaging is Sesame-Street gestileerd: deze post wordt je aangeboden door de letter 'O'

(Technische en ontwerptips)