Domača » Grafika » Geomicons - edinstven ročno kodiran SVG Iconset

    Geomicons - edinstven ročno kodiran SVG Iconset

    Spletne ikone hitro postajajo norma za moderno spletno oblikovanje. To so ogromna sredstva za spletne oblikovalce kot ti ikone lahko prilagodite prek CSS-ja in spremenili velikost brez izgube kakovosti.

    Toda nekateri paketi ikon se lahko počutijo napihnjeni in preveliki za manjša mesta. Tukaj res sijata Geomicons.

    To je a zbirka ikon po meri po meri, ki se izvaja na SVG. Ikone lahko vdelate prek skriptov JS ali kot neposredne datoteke SVG na vašo stran. Kakorkoli, oni so lepi vektorji in super preprosti za preoblikovanje.

    Glavna Geomiconsova stran vsebuje celoten demo vseh ikon. Preprosto so in sledijo tradicionalnemu enobarvnemu slogu, ki ga vsi poznamo.

    Toda njihova nastavitvena informacija je zagotovo pomanjkljiva na demo strani. Če se želite naučiti, kako to nastavite, boste morali za navodila obiskati GitHub repo.

    Privzeto je to knjižnica predvideva, da delate s CSS / JS da bi bile te ikone vdelane neposredno v elemente strani. Ko pa prenesete ikone iz GitHub-a, dobite vse surove datoteke SVG, ki jih lahko dodate neposredno v HTML.

    Samo težava je surovi SVG-ji zahtevajo večjo urejanje za spreminjanje barv, medtem ko pot JS / CSS omogoča nadzor barv prek kode.

    Preprosto dodajte geomicons.min.js skript v glavo in prenese ikona podatkov atribut v elemente HTML. Ti bodo samodejno vdelali ikone, ki jih lahko nato upravljate s pomočjo razredov CSS.

    Druga stvar, ki mi je všeč pri Geomiconsu, je podpora za Node. Tukaj je vzorec odrezka iz repo GitHub:

    var geomicons = require ("geomicons-open"); var pathData = geomicons.paths.heart; // Vrne vrednost atributa d poti sv svStString = geomicons.toString ('srce'); // Vrne niz SVG

    Če niste seznanjeni z Node, potem vam verjetno nikoli ne bo treba uporabiti odrezkov vozlišča. Enako velja za različico teh ikon React.js.

    Še vedno je podpora za večje okvire velik posel. To je več dokazov, da so Geomiconi namenjeni podpira vse vrste spletnih strani s poudarkom na uspešnosti.

    Če želite tem ikonam dati poskusni zagon, lahko kopijo prek npm ali pa jih prenesete neposredno prek GitHub.

    Obstaja tudi ikona z ikonami, imenovano Geomicons Wired, ki jo boste morda želeli preizkusiti.

    Kakorkoli, to je a briljantno ikono za minimalistične spletne oblikovalce. Odlična izbira za optimizacijo spletnega mesta s čudovitimi ikonami, obenem pa zmanjša čas skupne obremenitve strani.