Anastasia Ovchinnikova

Follow

Apr 5, 2020 · 13 min de citit

Icoanele au un rol semnificativ în oferindu-vă prima impresie despre site-ul sau aplicația de interfață. Dar este nevoie de mult timp și bani pentru a le dezvolta de la zero., Utilizarea pictogramelor pe site-ul dvs. vă permite să comunicați eficient cu vizitatorii dvs.: acestea sporesc lizibilitatea, evidențiază conținutul important, re-impun funcționalitatea sau caracteristicile și îmbunătățesc designul. Prin urmare, merită să fiți atenți la cele mai bune pachete de pictograme gata făcute.

de Asemenea, atunci când vine vorba de design icon, aceasta este o modalitate foarte bună de a prezenta designer de calificări., Un pachet de icoane dulce și frumos este o vitrină perfectă a muncii designerului și un instrument puternic pentru a vă construi reputația online.

iată câteva avantaje mari de a folosi icoane în următorul proiect de design UX.

  • pictogramele ajută la creșterea lizibilității site-ului sau a aplicației.
  • pictogramele bine făcute ajută la reducerea volumului textului. Utilizarea pictogramelor face ca mesajul dvs. să fie înțeles fără text.
  • Pictogramele pot adăuga personalizare la produsul dvs.
  • Pictogramele pot fi un bun punct de plecare în cunoașterea produsului.,nu în ultimul rând: una dintre cele mai importante funcții ale pictogramelor este de a ajuta utilizatorii să înțeleagă intuitiv aplicația atât la prima cunoaștere, cât și în timpul utilizării ulterioare.în acest articol, veți găsi o colecție a unora dintre cele mai bune pachete de pictograme pe care le puteți utiliza pe site-ul sau afacerea dvs., chiar dacă nu sunteți un artist creativ. Produsele prezentate în acest articol pot fi utilizate nu numai pe site-uri web comune și în cazuri de bază, ci și în cele mai complexe și specializate.am împărțit produsele în mai multe categorii pentru ușurința dvs., Înainte de descrieri veți vedea categoria din care face parte acest produs.

    • seturi de pictograme gratuite.
    • piețe de desfacere. Piața conține pictograme de la diferiți producători. Aici puteți găsi atât produse ieftine, cât și scumpe, precum și produse bune și de calitate scăzută.
    • seturi de pictograme de design Material și seturi de pictograme plate.
    • CSS icon seturi. Pictogramele CSS sunt realizate folosind-ghici ce-CSS. Pentru a le utiliza, trebuie doar să copiați codul pe pagina dvs.
    • fonturi icoane. Potrivit Pluralsight, fonturi icon sunt fonturi reale care conțin simboluri și hieroglife în loc de litere sau numere., Sunt populare pentru designerii web, deoarece le puteți modela cu CSS la fel ca textul obișnuit. Fonturile pictogramelor sunt tratate ca text de browsere, așa că va trebui să le normalizați pentru a evita problemele anti-aliasing ale textului și sunt acceptate în aproape toate browserele.
    • icoane SVG. Scalable Vector Graphics (SVG) este un format grafic vectorial bazat pe XML care poate scala la orice dimensiune fără a pierde claritatea. Ele pot fi afișate prin utilizarea CSS, tag-uri obiect, tag-uri imagine, sau inlined direct în HTML.
    • Glyph și pictograme seturi de pictograme.,

    Flaticon

    sursa Imaginii: https://www.flaticon.com/packs

    Flaticon conține complet editabil vectori și poate fi folosit atât pentru personal, cât și proiecte comerciale. FlatIcon are mai mult de 2,3 milioane de pictograme vectoriale grupate în 51202 pachete.produsul are o extensie Adobe care vă permite să importați cu ușurință pictograme în Photoshop, Illustrator și After Effects., Dacă doriți să utilizați un font web în loc de fișiere statice pentru pictogramele dvs., FlatIcon va avea grijă de conversia formatului și va genera un font web gata de utilizare. De asemenea, puteți personaliza pictogramele descărcate.

    fapte cheie:

    • peste 90.000 de pictograme;
    • formate SVG, EPS, PSD și PNG;
    • fonturi de pictograme;
    • extensie Adobe pentru CC suite;
    • Licență Linkshare cu opțiuni premium; și
    • pachete de pictograme noi sunt adăugate în fiecare lună.,un abonament premium cu FlatIcon vă va oferi drepturi complete de licențiere, acces la conținut exclusiv, fără reclame, Aplicații MacOS și extensii Adobe, precum și posibilitatea de a crea colecții nelimitate.,

      Jam Icons

      Web-site: https://jam-icons.com/
      Format and Type: SVG, CSS
      Price and License: Free, MIT

      Image source: https://jam-icons.com/

      Jam icons are a set of 896 handcrafted icons. This icon pack comes with both SVG and font versions. The icons can be used as SVG files in your web, print or application development projects., Pictogramele pot fi de asemenea folosite ca font cu foile de stil CSS date. Există dimensiuni de 16px, 24px și 32px. Puteți alege, de asemenea, pentru a umple sau accident vascular cerebral icoane.

      Fontisto Icon Pack

      Web-site: https://fontisto.com/
      Format și Tip: CSS
      Preț și Licență: Gratuit, MIT

      sursa Imaginii: https://fontisto.com/

      Fontisto este un vector icoane ambalaj., Icoanele pot fi personalizate instantaneu: dimensiunea, culoarea, umbra și orice se poate face cu puterea CSS. Produsul nu necesită Javascript. Pictogramele Fontisto sunt vectori, ceea ce înseamnă că vor arăta bine pe monitoarele de înaltă rezoluție.pe site-ul web, puteți găsi documentație completă și diverse ghiduri despre cum să porniți și să personalizați produsul. Puteți începe să utilizați produsul pur și simplu lipirea link-ul de pe site-ul dvs. În plus, puteți utiliza Fontisto cu managerii de pachete potriviți pentru dvs.: npm, fire, bower etc.,

      Iconmonstr

      Web-site: https://iconmonstr.com/
      Format și Tip: SVG, EPS, PSD și PNG, Piata
      Preț și de Licență: Gratuit

      sursa Imaginii: https://iconmonstr.com/

      Iconmonstr colecția de icoane a 4400+ icoane. Fiecare set de pictograme oferă atât contururi, cât și versiuni completate ale graficii pentru a se asigura că pot fi utilizate pentru o varietate de aplicații de proiectare., Fiecare pictogramă de pe acest site este disponibilă gratuit, iar fișierele cu pictograme vin în formate precum SVG, AI, PSD și PNG. Fișierele pot fi utilizate în scopuri gratuite și comerciale.Iconmonstr face simplu pentru a căuta icoane prin intermediul funcției sale de căutare puternic. Puteți chiar să salvați pictogramele preferate într-o colecție personală pentru utilizare ulterioară.

      caracteristici cheie:

      • utilizarea gratuită a tuturor pictogramelor,
      • Patru opțiuni de descărcare în format și
      • pictograme reduse optimizate pentru utilizare web.,

      Pixsellz Icoane Materiale de Bibliotecă

      sursa Imaginii: https://icons.pixsellz.io/

      Un pachet mare de peste 1000 de icoane împărțit în 16 categorii diferite. Pachetul gratuit de pictograme este inspirat de designul materialului și prezentat în trei stiluri vizuale diferite — rotunjite, contur și două tonuri., Setul este disponibil în 6 formate de fișiere diferite, astfel încât să puteți utiliza pictogramele din software-ul de design preferat.

      caracteristici Cheie:

      • 3 stiluri,
      • Figma stiluri,
      • 1000+ icoane,
      • 24×24 pixeli,
      • stiluri de referință și simboluri,
      • 16 categorii, și
      • 6 formate de fișiere.

      Entypo

      site-ul web:http://www.entypo.com/
      Format și tip: SVG
      preț și Licență: Gratuit, Creative Common License 4.,0

      sursa Imaginii: http://www.entypo.com/

      Entypo este o svg icon family pack, atent lucrate cu câțiva ani în urmă de Daniel Bruce în Suedia. Aceste pictograme sunt superbe: când vine vorba de freebies, acestea sunt de top. Produsul vine ca SVG cu 411 icoane, gratuit cu o licență Creative Commons.,autorul spune că construirea unui font necesită mult timp și este mai bine să-și petreacă timpul pe dezvoltarea de noi pictograme.

      Rele Icoane

      Web-site: https://evil-icons.io/
      Format și Tip: SVG, Schiță
      Preț și Licență: Gratuit, MIT

      sursa Imaginii: https://evil-icons.io/

      Acest pachet este absolut masiv și vine cu totul, inclusiv svg s și fișierele sursă originale., Asta înseamnă că puteți descărca SVGs împreună cu fișiere pentru Illustrator și .fișiere schiță Pentru Schiță.fiecare pictogramă urmează stilul liniei subțiri și este perfectă pentru majoritatea site-urilor web. Faptul că puteți edita sursa originală le face și mai valoroase.,

      Streamline Icons

      Web-site: https://streamlineicons.com/
      Format and Type: ICONJAR, SKETCH, FIG, XD, SVG, AI, PDF, PNG
      Price and License: Free to $411

      Image source: https://streamlineicons.com/

      Streamline Icons is another nice and adaptable free icon pack on the web market. The tool is organized in 53 categories with over 30000 vector icons.,acesta este unul dintre puținele pachete de pictograme optimizate pentru Sketch, ceea ce face ușor de manipulat lățimile și culorile cursei. Funcțiile de schiță încorporate, cum ar fi simbolurile și stilurile partajate, fac din reutilizarea elementelor, cum ar fi pictogramele, un proces rapid și ușor.compania are propria aplicație web care ajută la navigarea, căutarea și descărcarea pictogramelor direct din browser.,caracteristici cheie:

      • mai mult de 30000 de pictograme vectoriale organizate;
      • Strokes inteligente pentru a modifica grosimea conturului;
      • Sketch, AI, EPS, PDF, PNG, formate SVG;
      • aplicație web pentru a căuta și edita pictograme;
      • fiecare pictogramă din Streamline 3.0 are trei greutăți unice: ușoare, regulate și îndrăznețe.,

      Smashicons

      Web-site: https://smashicons.com/
      Format și Tip: BORCAN, SVG, AI, SCHIȚĂ, Piata
      Preț și de Licență: Gratuit la $149

      sursa Imaginii: https://smashicons.com/

      Smashicons oferă o cuprinzătoare colecție de icoane cu peste 219000+ icoane în biblioteca lor. Smashicons funcționează puțin diferit decât altele: prețurile lor se bazează pe un plan lunar de 5 USD/lună., Aceasta înseamnă că, pentru 5 dolari pe lună, veți avea acces la întreaga lor colecție de pictograme existente, precum și la orice pictograme viitoare pe care le eliberează.caracteristici cheie:

      • o colecție foarte mare de icoane,
      • toate pictogramele sunt compatibile cu mai multe platforme,
      • aplicație web ușor de utilizat pentru a căuta și găsi pictogramele de care aveți nevoie,
      • model de afaceri bazat pe abonament,
      • suport multiplatform.

      Icons8

      site-ul Web:https://icons8.com/
      Format și tip: SVG, PNG, PDF
      licență și prețuri: Licență băiat bun, gratuit la 19.,90 pe lună

      sursa Imaginii: https://icons8.com/

      set de icoane de Icons8 vine cu mai mult de 120000 de icoane, care acoperă mai multe categorii, de la afaceri și de birou de setări pentru oameni, alimente, și icoane sociale mass-media. Pictogramele sunt concepute pentru a imita aspectul unui anumit sistem de operare. Le puteți descărca în versiunile Windows, iOS și Android.,pictogramele funcționează cu Sketch, Photoshop și Xcode. Puteți utiliza un editor web înainte de a descărca pictogramele în sistemul dvs.

      caracteristici cheie:

      • formate SVG, PNG și HTML;
      • pictograme disponibile în diferite stiluri, cum ar fi pictograma linie, pictograma umplută și culoarea completă;
      • toate pictogramele pot fi descărcate prin .fișier zip;
      • Editați Înainte de descărcare;
      • atât opțiuni de abonament gratuite, cât și plătite.,

      Icomoon

      Web-site: https://icomoon.io/
      Format and Type: SVG, PNG, PDF
      License and Pricing: Free to $139 per month

      Image source: https://icomoon.io/

      Icomoon comes as a complete tool for iconography and icon management. The product has a high-quality solution for editing and managing icons., Icoanele Icomoon au fost realizate manual pe o grilă de 16×16 și sunt disponibile în formate SVG, EPS, PSD, PDF și AI. Setul de pictograme este, de asemenea, actualizat constant de creatorii săi.fiecare pachet de pictograme oferă licențiere detaliată, astfel încât designerii și dezvoltatorii să știe exact cum pot fi utilizate pictogramele. Utilizatorii pot face, de asemenea, propriile fonturi icon personalizate.

      caracteristici cheie:

      • instrumente cuprinzătoare de gestionare a pictogramelor,
      • Opțiuni de descărcare gratuite și plătite,
      • o mare varietate de formate de descărcare,
      • actualizări gratuite și ușoare.,

      Glyphish Icon Pack

      sursa Imaginii: http://www.glyphish.com/

      Glyphish oferă o varietate de diferite pachete de icon. Fiecare pachet vine într-o varietate de formate diferite, inclusiv PNG, SVG, PSD și AI. Pachetul de pictograme de bază este disponibil pentru 25 USD, în timp ce cel final este disponibil la un preț obișnuit de 99 USD. Demo-ul gratuit include 50 de pictograme. Toate pictogramele pot fi ușor editate de designeri.,

      caracteristici cheie:

      • pictograme pentru mai multe platforme: iOS, Android, Web, Windows;
      • un set de 50 de pictograme gratuite;
      • ușor drag-and-drop în Xcode;
      • icoane special dimensionate pentru afișajele Apple Retina.,

      Ionicons

      Web-site: https://ionicons.com/
      Format și Tip: SVG și Webfont, font Icon
      de Licență: MIT

      sursa Imaginii: https://ionicons.com/

      Ionic echipa a decis să-i elibereze icoanele lor ca un webfont numit Ionicons. Bineînțeles că sunt complet gratuite și disponibile pe GitHub. Puteți adăuga chiar și aceste pictograme direct pe site-ul dvs. folosind versiunea CDN a foii de stil., Acesta susține pe deplin SVG și fonturi web.

      caracteristici cheie:

      • complet gratuit,
      • configurare ușoară prin copierea și lipirea link-ul,
      • vine ca un webfont,
      • dimensiuni personalizate,
      • peste 1100 de articole.

      Unghiulare Icoane Materiale

      sursa Imaginii: https://material.io/resources/icons/?style=baseline

      Material Icoana este free icon pack de la Google., Pentru a asigura lizibilitatea și claritatea, aceste pictograme au fost optimizate pentru a arăta excelent pe toate platformele și afișajele. Aceste icoane materiale sunt complet gratuite și accesibile pe GitHub. Acest pachet de pictograme este absolut masiv, cu peste 1.000 de pictograme care acoperă o gamă largă de caracteristici de interfață.toate simbolurile sunt disponibile în cinci teme. Veți obține o gamă de dimensiuni și densități descărcabile. Cel mai bun format pentru proiecte web este un font web ușor de utilizat pictogramă.,

      Linearicons

      sursa Imaginii: https://linearicons.com/

      Liniare Icon pack este unul dintre cele mai populare și cele mai bune pachete de icon pentru scopuri personale sau comerciale. Linear icon pack vine în ambele versiuni gratuite și premium. Versiunea gratuită a acestui pachet icon uimitor vine sub Creative Common license. Există, de asemenea, diferite pachete pe care le puteți alege pentru nevoile dvs., cum ar fi Pachetul Desktop.,

      Key features:

      • CloudFront CDN;
      • free version available;
      • comes with different formats: SVG, PDF, Webfont.

      Feathericons

      Web-site: https://feathericons.com/
      Format and Type: SVG, Webfont, Iconfont
      License and Pricing: Free, MIT License

      Image source: https://feathericons.com/

      Feather is one of the most popular open-source icon sets., Acestea sunt pictograme open source care au fost proiectate pe o grilă 24×24. Pictogramele sunt disponibile în format SVG. Este sub licența MIT și există aproximativ 250 de pictograme în open source.pictogramele sunt ușor de editat, curate și clare — indiferent de dimensiune. Acestea au fost concepute ca un font icon primul, deci este menit să fie încorporat ca un font web.,

      Iconfinder

      Web-site: https://www.iconfinder.com/
      Format: SVG, PNG, ICO, Marketplace
      License and Pricing: From $9 to $49 per month

      Image source: https://www.iconfinder.com/

      Iconfinder is one of the most popular icon resources on the net. It offers over 4 million icons, providing users with a variety of search options including icon format, price, size, background, etc., Există mai multe planuri lunare de plată — de la 9 la 49 USD. De asemenea, puteți alege sistemul „plătiți în timp ce mergeți”.fișierele Icon sunt disponibile în formatele SVG, PNG, ICO, ICNS și Adobe Illustrator, iar dimensiunile variază între 16×16 și 512×512. De asemenea, puteți lucra cu unii dintre cei mai buni designeri ai site-ului Dacă nu puteți găsi ceva care vă place sau pur și simplu doriți pictograme personalizate concepute special pentru dvs. și marca dvs.,caracteristici cheie:

      • atât opțiuni de Utilizare gratuite, cât și plătite,
      • caracteristici de căutare flexibile,
      • pictograme disponibile într-o varietate de formate,
      • o mulțime de categorii și stiluri,
      • editor de pictograme.

      Substantiv Proiect

      sursa Imaginii: https://thenounproject.com/

      Substantiv Proiect oferă una dintre cele mai mari biblioteci pictograma disponibile pe web., Majoritatea pictogramelor acestui site sunt disponibile în formate SVG și PNG, precum și în stiluri alb-negru.biblioteca site-ului este alcătuită din fișiere cu pictograme proiectate de o varietate de designeri independenți. Este un loc în care creatorii și profesioniștii creativi pot colabora pentru a-și vinde desenele și pentru a găsi o bibliotecă aparent nesfârșită de pictograme premium.căutarea acestei biblioteci uriașe și cuprinzătoare de pictograme este foarte ușoară. Caracteristicile cheie suplimentare ale acestei biblioteci de pictograme includ opțiuni de descărcare gratuite și premium, multe seturi mari de pictograme, o aplicație pentru Mac și multe altele., Această bibliotecă de pictograme este actualizată periodic, iar noi pictograme și seturi sunt postate în fiecare zi.

      caracteristici Cheie:

      • peste 150.000 de icoane;
      • SVG, PNG;
      • căutare și descoperire instrumente;
      • Licența Creative Comun cu opțiuni premium;
      • gratuit și plătit opțiuni de descărcare;
      • noi icoane încărcate pe o aproape zilnic.

      Fontawesome Icons

      Web-site:https://fontawesome.com/icons
      Format și tip: SVG, PNG, Icon font, Marketplace
      licență și prețuri: SIL OFL 1.,1

      sursa Imaginii: https://fontawesome.com/icons

      Font Minunat este cel mai folosit și cel mai popular font icon set apropiere. Este, de asemenea, pictograma implicită setată pentru echipa de la bootstrap. De asemenea, este disponibil ca icoane SVG printre alte formate.Licența este deschisă și gratuită pentru orice, comercial sau personal.fiecare pictogramă este complet scalabilă și întreținută direct în CSS., Puteți schimba culorile, umbrele, gradienții de fundal și aproape orice altceva folosind CSS3 pur. Un alt motiv pentru a utiliza această bibliotecă este că este complet optimizat și nu are probleme de compatibilitate, deoarece nu necesită JavaScript deloc.

      caracteristici cheie:

      • font Vector,
      • fiecare pictogramă vine cu o clasă CSS & Unicode,
      • gratuit,
      • construit cu accesibilitate în minte,
      • oferă o foaie de ieftin desktop pentru întreaga bibliotecă icon.,

      Lineicons

      Web-site: https://lineicons.com/
      Format și Tip: SVG, Web font, font Icon
      de Licență și de stabilire a Prețurilor: Gratuit

      sursa Imaginii: https://lineicons.com/

      LineIcons oferi, de asemenea, CDN gratuit cu o documentație clară, ceea ce face mai ușor pentru a începe.acest pachet de pictograme este complet gratuit și vine cu peste 450 de pictograme de linie., Acesta acoperă fiecare pictogramă esențială de care aveți nevoie pentru proiect din diferite categorii. LineIcons oferă, de asemenea, CDN gratuit și documentație clară pentru a începe cu ușurință. Vine cu 2 pachete scalabile diferite-WebFonts și fișiere SVG pe care le puteți utiliza în funcție de nevoile dvs. de proiect.

      caracteristici cheie:

      • 450 + icoane gratuite,
      • fișiere SVG,
      • Font web gata,
      • CDN gratuit.,

      Gânduri finale

      alegerea resursei bibliotecii de pictograme potrivite pentru proiectul dvs. nu trebuie să se bazeze pe ceea ce este considerat cel mai popular, ci mai degrabă pe ceea ce se potrivește cel mai bine nevoilor proiectului dvs. Atunci când alegeți pictograme, acordați atenție cât de ușor este să începeți un proiect, ce formate sunt prezente în bibliotecă și prețul.de asemenea, un factor important atunci când alegeți un pachet de pictograme va fi potrivirea stilului aplicației sau site-ului dvs.sperăm că acest articol vă va ajuta să alegeți cea mai potrivită soluție pentru nevoile dvs.