Micon - Een Windows 10 pictogramlettertype voor webontwerpers

De herontwerp voor Windows 10 kwam met veel nieuwe functies en een geheel nieuwe look. Een van de grootste veranderingen kwam in de pictogramstijl, vooral vergeleken met Windows 7 en XP.

Dankzij de Micon ingesteld, je kan nu breng Win10-stijl iconen rechtstreeks naar uw website.

Dit icon pack komt als een pictogramlettertype en zijn gratis uitgebracht via GitHub. De belangrijkste repo heeft de setup-informatie, maar de startpagina van Micon beschikt over alle pictogrammen tentoongesteld met de juiste klassenamen.

De feitelijke websitestructuur volgt een vergelijkbaar formaat als Font Awesome. Jij kan blader door alle pictogrammen en klik op een van deze om meer informatie over een nieuwe pagina te krijgen.

Neem bijvoorbeeld dit pictogram voor het opladen van de batterij dat een batterijontwerp en een kleine oplaadstekker gebruikt. Je krijgt een voorbeeld van het pictogram in verschillende formaten, samen met zijn CSS-pictogramklasse, in dit geval mi-BatteryCharging10.

Deze pictogramreeks werkt ook heel erg zoals Font Awesome, waar je kunt sluit de pictogrammen rechtstreeks in uw HTML in. Het codefragment voor dit batterijpictogram werkt precies hetzelfde:

Het is super eenvoudig om te beginnen, met alleen een kopie van het Micon CSS-stylesheet en enige basiskennis van front-end ontwikkeling.

Bekijk de instellingenpagina meer leren. Echt, je moet het gewoon doen download een kopie van het Micon-pakket van GitHub en voeg dat stylesheet (samen met de juiste pictogramlettertypen) toe aan uw pagina. Vanaf daar, alleen verwijs naar de klassenamen zoals hierboven en je bent klaar om te gaan.

Omdat dit project open-source is, ben je dat wel vrij om deze pictogrammen te gebruiken met elk project, persoonlijk of commercieel. En je kunt zelfs maak je eigen bestand door de bouwinstructies van de Micon GitHub te volgen. Op deze manier kunt u pak alleen de pictogrammen in die u wilt in de lettertypebestanden en verkleinen de totale bestandsgrootte.

Over het algemeen ben ik erg onder de indruk van de verscheidenheid aan pictogrammen en de eenvoudige installatie. Je kunt vinden genoeg voorbeelden op de website en zelfs geanimeerde pictogrammen op de voorbeeldenpagina die codefragmenten bevat.

Deze pictogrammen zelfs werkt goed met Bootstrap, dus je kunt het combineer het met het BS3 / BS4-raamwerk voor sommige echte aangepaste lay-outs.

Download een gratis copyright van de startpagina van Micon en bekijk hoe u deze Windows 10-stijlpictogrammen in uw volgende ontwerp kunt gebruiken.