Geomicons - En unik håndkodet SVG Iconset
Web iconsets bliver hurtigt ved at blive normen for moderne webdesign. De er massive aktiver til webdesignere som disse ikoner kan tilpasses via CSS og ændret uden noget kvalitets tab.
Men nogle ikonpakker kan føle sig oppustede og for store til mindre steder. Det er her, hvor Geomicons virkelig skinner.
Dette er en Brugerdefineret håndkodet ikonpakke kører på SVG. Du kan indlejre ikonerne via JS-scripts eller som direkte SVG-filer til din side. Uanset hvad, de er smukke vektorer og super nemme at restylle.
Den vigtigste Geomicons-side indeholder en fuld demo af alle ikonerne. De er ret enkle og følger den traditionelle enkeltfarvede flade design stil, vi er alle bekendt med.
Men deres installationsoplysninger mangler helt sikkert demo-siden. Hvis du vil lære at oprette dette, skal du besøge GitHub repo for instruktioner.
Som standard er dette bibliotek forudsætter at du arbejder med CSS / JS at have disse ikoner indlejret direkte i sideelementer. Men når du downloader ikonerne fra GitHub får du alle de ruwe SVG-filer, som du kan føje direkte til HTML.
Kun problemer er det Rå SVG'er kræver mere redigering for at ændre farver, mens JS / CSS-ruten giver dig kontrol over farver via koden.
Du skal blot tilføje geomicons.min.js script i dit overskrift og videregive data-ikon attribut til HTML-elementer. Disse vil automatisk indlejre ikoner, som du derefter kan manipulere ved hjælp af CSS-klasser.
En anden ting jeg virkelig kan lide om Geomicons er støtten til Node. Her er en prøveuddrag fra GitHub repo:
var geomicons = kræver ('geomicons-open'); var pathData = geomicons.paths.heart; // Returnerer stien d-attributværdi var svgString = geomicons.toString ('heart'); // Returnerer en SVG-streng
Hvis du ikke er bekendt med Node, skal du sandsynligvis aldrig bruge nogen af knudepunkterne. Det samme gælder for React.js-versionen af disse ikoner.
Stadig at have støtte til store rammer er en stor aftale. Det er mere bevis for, at Geomicons er beregnet til støtte enhver form for hjemmeside ved først at fokusere på præstationer.
For at give disse ikoner en testkørsel kan du trække en kopi gennem npm eller downloade dem direkte via GitHub.
Der er også en oversigt ikonet kaldet Geomicons Wired, som du måske vil teste også.
Uanset hvad, det er en strålende ikonsæt til minimalistiske webdesignere. Et perfekt valg til optimering af dit websted med smukke ikoner, samtidig med at den samlede sidebelastningstider reduceres.