Domovská » Grafika » Geomicons - unikátní ruční kódovaný SVG Iconset

    Geomicons - unikátní ruční kódovaný SVG Iconset

    Webové ikony se rychle stávají normou pro moderní web design. Jsou to obrovská aktiva pro webové designéry jako tyto ikony lze přizpůsobit pomocí CSS a bez změny kvality.

    Některé balíčky ikon se však mohou cítit nafouknuté a příliš velké pro menší stránky. To je místo, kde Geomicons opravdu svítí.

    Toto je vlastní ručně kódovaný balíček ikon na SVG. Ikony můžete vložit pomocí skriptů JS nebo přímých souborů SVG na stránku. Ať tak či onak, jsou to krásné vektory a super snadné je restyle.

    Hlavní stránka Geomicons obsahuje kompletní demo všech ikon. Jsou to docela jednoduché a následují tradiční jednobarevný plochý designový styl, se kterým jsme všichni seznámeni.

    Na stránce demo však určitě chybí informace o jejich nastavení. Pokud se chcete dozvědět, jak to nastavit, budete muset navštívit návod GitHub.

    Ve výchozím nastavení toto knihovna předpokládá, že pracujete s CSS / JS mít tyto ikony vloženy přímo do prvků stránky. Přesto, když si stáhnete ikony z GitHubu, dostanete všechny raw SVG soubory, které můžete přidat přímo do HTML.

    Jediný problém je surové SVG vyžadují více úprav pro změnu barev, zatímco trasa JS / CSS umožňuje kontrolu barev pomocí kódu.

    Stačí přidat geomicons.min.js skript do záhlaví a projít ikona data atribut do elementů HTML. Tyto budou automaticky vkládat ikony, které pak můžete manipulovat pomocí CSS tříd.

    Další věc, kterou mám na Geomicons opravdu rád, je podpora Node. Zde je ukázka úryvku z repo GitHub:

    var geomicons = vyžadují ('geomicons-open'); var pathData = geomicons.paths.heart; // Vrací hodnotu atributu d cesty var svgString = geomicons.toString ('heart'); // Vrací řetězec SVG

    Pokud nejste obeznámeni s uzlem, pak pravděpodobně nebudete muset nikdy používat žádné z útržků uzlu. Totéž platí pro verzi těchto ikon React.js.

    Velice důležitá je stále podpora velkých rámců. Je to další důkaz, že Geomicons je určen podporovat jakýkoli typ webové stránky nejprve zaměřením na výkon.

    Chcete-li dát těmto ikonám zkušební běh, můžete vytáhnout kopii přes npm nebo stáhnout přímo přes GitHub.

    K dispozici je také sada ikon nazvaná Geomicons Wired, kterou byste chtěli také otestovat.

    Ať tak či onak, je to brilantní iconset pro minimalistické webové designéry. Perfektní volba pro optimalizaci vašich stránek s krásnými ikonami při současném snížení celkové doby načítání stránky.