Anastasia Ovchinnikova

Follow

Apr 5, 2020 · 13 min read

Symbole haben eine wichtige Rolle in Ihnen den ersten Eindruck von der Website oder Anwendung Schnittstelle. Aber es braucht viel Zeit und Geld, um sie von Grund auf neu zu entwickeln., Durch die Verwendung von Symbolen auf Ihrer Website können Sie effektiv mit Ihren Besuchern kommunizieren: Sie erhöhen die Lesbarkeit, markieren wichtige Inhalte, erzwingen Funktionen oder Funktionen erneut und verbessern das Design. Daher lohnt es sich, auf vorgefertigte Best Icon Packs zu achten.

Auch wenn es um Symboldesign geht, ist dies eine großartige Möglichkeit, designer Qualifikationen., Ein süßes, schönes Icon Pack ist ein perfektes Schaufenster der Arbeit des Designers und ein leistungsfähiges Instrument, um Ihren Ruf online aufzubauen.

Hier sind einige großartige Vorteile der Verwendung von Symbolen in Ihrem nächsten UX-Designprojekt.

  • Symbole helfen, die Website oder App Lesbarkeit zu erhöhen.
  • Gut gemachte Symbole helfen, Textvolumen zu reduzieren. Die Verwendung von Symbolen macht Ihre Nachricht ohne Text verständlich.
  • Icons können Ihrem Produkt Personalisierung hinzufügen.
  • Icons können ein guter Ausgangspunkt sein, um das Produkt kennenzulernen.,
  • Last, but not least: Eine der wichtigsten Funktionen von Symbolen besteht darin, Benutzern zu helfen, die Anwendung sowohl bei der ersten Bekanntschaft als auch bei der anschließenden Verwendung intuitiv zu verstehen.

In diesem Artikel finden Sie eine Sammlung einiger der besten Icon-Packs, die Sie auf Ihrer Website oder in Ihrem Unternehmen verwenden können, auch wenn Sie kein kreativer Künstler sind. Die in diesem Artikel vorgestellten Produkte können nicht nur auf gängigen Websites und in grundlegenden Fällen, sondern auch in komplexeren und spezialisierteren verwendet werden.

Wir teilen die Produkte in mehrere Kategorien, für Ihre Leichtigkeit., Vor Beschreibungen sehen Sie die Kategorie, zu der dieses Produkt gehört.

  • Freie Symbolsätze.
  • Marktplätze. Der Marktplatz enthält Symbole verschiedener Hersteller. Hier finden Sie sowohl billige als auch teure sowie gute und minderwertige Produkte.
  • Material design icon-sets und Flache icon-sets.
  • CSS-Symbol-sets. CSS-Symbole werden mit — guess what — CSS erstellt. Um sie zu verwenden, kopieren Sie einfach den Code auf Ihre Seite.
  • Symbole Schriftarten. Laut Pluralsight sind Symbolschriften tatsächliche Schriftarten, die Symbole und Glyphen anstelle von Buchstaben oder Zahlen enthalten., Sie sind bei Webdesignern beliebt, da Sie sie wie normalen Text mit CSS formatieren können. Symbolschriftarten werden von Browsern als Text behandelt, daher müssen Sie sie normalisieren, um Probleme mit dem Anti-Aliasing von Text zu vermeiden, und werden in fast allen Browsern unterstützt.
  • SVG-icons. Scalable Vector Graphics (SVG) ist ein XML-basiertes Vektorgrafikformat, das auf jede Größe skaliert werden kann, ohne an Klarheit zu verlieren. Sie können mithilfe von CSS, Objekt-Tags, Bild-Tags oder direkt in Ihrem HTML-Code angezeigt werden.
  • Glyphen-und Piktogrammsymbole.,

Flaticon

Bildquelle: /div>

Flaticon enthält vollständig editierbare Vektoren und kann sowohl für persönliche als auch für kommerzielle Projekte verwendet werden. FlatIcon hat mehr als 2,3 Millionen Vektor-Icons in 51202 Packs gruppiert.

Das Produkt verfügt über die Erweiterung Adobe, mit der Sie Symbole problemlos in Photoshop, Illustrator und After Effects importieren können., Wenn Sie eine Webschrift anstelle statischer Dateien für Ihre Symbole verwenden möchten, kümmert sich FlatIcon um die Formatkonvertierung und generiert eine gebrauchsfertige Webschrift. Sie können auch heruntergeladene Symbole anpassen.

Fakten:

  • über 90.000 icons;
  • SVG -, EPS -, PSD-und PNG-Formate;
  • Symbol-Schriftarten;
  • Adobe Erweiterung CC suite;
  • Linkshare-Lizenz mit premium-Optionen; und
  • neue icon-packs werden Hinzugefügt jeden Monat.,

Ein Premium-Abonnement mit FlatIcon bietet Ihnen volle Lizenzrechte, Zugriff auf exklusive Inhalte, keine Werbung, macOS-App und Adobe-Erweiterungen sowie die Möglichkeit, unbegrenzte Sammlungen zu erstellen.,

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., Die Symbole können auch als Schriftart mit den angegebenen CSS-Stylesheets verwendet werden. Es gibt 16px, 24px, und 32px Größen. Sie können auch Symbole füllen oder streichen.

Fontisto Icon Pack

Website: https://fontisto.com/
Format und Typ: CSS
Preis und Lizenz: Kostenlos, MIT

Bildquelle:https://fontisto.com/

Fontisto ist ein Vektor icons pack., Symbole können sofort angepasst werden: Größe, Farbe, Schlagschatten und alles, was mit der Kraft von CSS getan werden kann. Das Produkt benötigt kein Javascript. Fontisto-Symbole sind Vektoren, was bedeutet, dass sie auf hochauflösenden Monitoren gut aussehen.

Auf der Website finden Sie die vollständige Dokumentation und verschiedene Anleitungen zum Starten und Anpassen des Produkts. Sie können das Produkt verwenden, indem Sie einfach den Link auf Ihrer Website einfügen. Darüber hinaus können Sie Fontisto mit den für Sie richtigen Paketmanagern verwenden: npm, yarn, bower usw.,

Iconmonstr

Website: https://iconmonstr.com/
Format und Typ: SVG, EPS, PSD und PNG, Marktplatz
Preis und Lizenz: Kostenlos

Bildquelle:https://iconmonstr.com/

Iconmonstr Sammlung von Symbolen hat 4400+ icons. Jedes Icon-Set bietet sowohl Umrisse als auch ausgefüllte Versionen der Grafiken, um sicherzustellen, dass sie für eine Vielzahl von Designanwendungen verwendet werden können., Jedes Symbol auf dieser Website ist kostenlos verfügbar, und Symboldateien gibt es in Formaten wie SVG, AI, PSD und PNG. Die Dateien können für kostenlose und kommerzielle Zwecke verwendet werden.

Iconmonstr macht es einfach, über seine leistungsstarke Suchfunktion nach Symbolen zu suchen. Sie können sogar Ihre Lieblingssymbole in einer persönlichen Sammlung für die zukünftige Verwendung speichern.

Key features:

  • freie nutzung aller symbole,
  • vier format download optionen, und
  • downsized icons optimiert für web verwenden.,

Pixsellz Material Icons Library

Bildquelle: https://icons.pixsellz.io/

Ein riesiges Bündel von über 1000 Symbolen, die in 16 verschiedene Kategorien unterteilt sind. Das kostenlose Icon Pack ist vom Materialdesign inspiriert und in drei verschiedenen visuellen Stilen dargestellt — abgerundet, umrissen und zweifarbig., Das Set ist in 6 verschiedenen Dateiformaten verfügbar, sodass Sie die Symbole in Ihrer bevorzugten Designsoftware verwenden können.

Key features:

  • 3 stile,
  • Figma stile,
  • 1000 + icons,
  • 24×24 pixel,
  • Skizze stile und symbole,
  • 16 kategorien, und
  • 6 datei formate.

Entypo

Website: http://www.entypo.com/
Format und Typ: SVG
Preis-und Lizenz: Free, Creative-Common-Lizenz 4.,0

Bild Quelle: http://www.entypo.com/

Entypo eine svg-icon-Familie pack sorgfältig in Handarbeit vor ein paar Jahren von Daniel Bruce in Schweden. Diese Symbole sind hervorragend: Wenn es um Werbegeschenke geht, stehen sie ganz oben. Das Produkt wird als SVG mit 411 Symbolen geliefert, kostenlos mit einer Creative Commons-Lizenz.,

Der Autor sagt, dass das Erstellen einer Schriftart viel Zeit in Anspruch nimmt und es besser ist, Zeit mit der Entwicklung neuer Piktogramme zu verbringen.

Böse Symbole

Website: https://evil-icons.io/
Format und Typ: SVG, Sketch
Preis und Lizenz: Kostenlos, MIT

Bildquelle: https://evil-icons.io/

Dieses Paket ist absolut massiv und es kommt mit allem-einschließlich SVGs und den ursprünglichen Quelldateien., Das heißt, Sie können SVGs zusammen mit Dateien für Illustrator und die herunterladen .skizze-Dateien für Skizze.

Jedes Symbol folgt der dünnen Linie Stil und sie sind perfekt für die meisten Websites. Die Tatsache, dass Sie die Originalquelle bearbeiten können, macht sie noch wertvoller.,

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.,

Dies ist eines der wenigen für Sketch optimierten Icon-Packs, mit dem Strichbreiten und-farben einfach bearbeitet werden können. Integrierte Skizzenfunktionen wie Symbole und gemeinsam genutzte Stile machen die Wiederverwendung von Elementen wie Symbolen zu einem schnellen und einfachen Vorgang.

Das Unternehmen verfügt über eine eigene Web-App, mit der Sie Symbole direkt aus dem Browser durchsuchen, suchen und herunterladen können.,

Key features:

  • mehr als 30000 vektor icons organisiert;
  • Smart Strokes zu ändern gliederung dicke;
  • Skizze, AI, EPS, PDF, PNG, SVG formate;
  • web app zu suchen und bearbeiten icons;
  • jedes symbol in Streamline 3,0 hat drei einzigartige gewichte: licht, regelmäßige und fett.,

Smashicons

Website: https://smashicons.com/
Format und Typ: JAR, SVG, AI, SKETCH, Marketplace
Preis-und Lizenz: Frei $149

Bild Quelle: https://smashicons.com/

Smashicons bietet eine umfassende Sammlung von Symbolen mit über 219000+ Symbole in Ihrer Bibliothek. Smashicons funktioniert ein bisschen anders als andere: Ihre Preise basieren auf einem monatlichen Plan von $5/Monat., Dies bedeutet, dass Sie für 5 USD pro Monat Zugriff auf die gesamte Sammlung vorhandener Symbole sowie auf alle zukünftigen Symbole erhalten, die sie veröffentlichen.

Key features:

  • eine sehr große sammlung von icons,
  • alle icons sind multi-plattform kompatibel,
  • einfach-zu-verwenden web app zu suchen und finden die symbole sie benötigen,
  • abonnement-basierend business modell,
  • multiplattform unterstützung.

Icons8

Website: https://icons8.com/
Format und Typ: SVG, PNG, PDF
Lizenz und Preise: Good Boy Lizenz, kostenlos bis 19.,90 pro Monat

Bildquelle: https://icons8.com/

figcaption>

Das Symbolset von Icons8 enthält mehr als 120000 Symbole, die verschiedene Kategorien abdecken.von Geschäfts-und Büroeinstellungen bis hin zu Personen -, Lebensmittel-und Social-Media-Symbolen. Die Symbole sollen das Aussehen eines bestimmten Betriebssystems nachahmen. Sie können sie in Windows -, iOS-und Android-Versionen herunterladen.,

Die Icons arbeiten mit Sketch, Photoshop und Xcode. Sie können einen Webeditor verwenden, bevor Sie die Symbole auf Ihr System herunterladen.

Key features:

  • SVG, PNG, und HTML formate;
  • icons in verschiedenen stilen, wie linie symbol, gefüllt symbol, und volle farbe;
  • alle symbole können heruntergeladen werden über .zip-Datei;
  • vor dem Herunterladen bearbeiten;
  • sowohl kostenlose als auch kostenpflichtige Abonnementoptionen.,

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., Die Icomoon Icons wurden auf einem 16X16 Raster handgefertigt und sind in den Formaten SVG, EPS, PSD, PDF und AI erhältlich. Das Symbolset wird auch ständig von seinen Erstellern aktualisiert.

Jedes Icon Pack verfügt über detaillierte Lizenzierung, so dass Designer und Entwickler genau wissen, wie Symbole verwendet werden können. Benutzer können auch ihre eigenen benutzerdefinierten Symbolschriftarten erstellen.

Hauptmerkmale:

  • umfassende Symbolverwaltungstools,
  • kostenlose und kostenpflichtige Downloadoptionen,
  • eine Vielzahl von Downloadformaten,
  • kostenlose und einfache Updates.,

Glyphish Icon Pack

Bildquelle: http://www.glyphish.com/

Glyphish bietet eine Vielzahl verschiedener Icon Packs. Jedes Paket kommt in einer Vielzahl von verschiedenen Formaten, einschließlich PNG, SVG, PSD und AI. Das Basic Icon Pack ist für 25 US-Dollar erhältlich, während das Ultimate Pack zu einem regulären Preis von 99 US-Dollar erhältlich ist. Die kostenlose Demo enthält 50 Symbole. Alle Symbole können leicht von Designern bearbeitet werden.,

Key features:

  • icons für mehrere plattformen: iOS, Android, Web, Windows;
  • eine reihe von 50 kostenlose icons;
  • einfache drag-and-drop in Xcode;
  • icons speziell für Apple Retina displays.,

Ionicons

Website: https://ionicons.com/
Format und Typ: SVG und Webfont, Icon font
Lizenz: MIT

Bildquelle:https://ionicons.com/

Das Ionic-Team beschloss, seine Icons als Webfont namens Ionicons zu veröffentlichen. Natürlich sind sie völlig kostenlos und auf GitHub verfügbar. Sie können diese Symbole sogar direkt mit der CDN-Version des Stylesheets zu Ihrer Site hinzufügen., Es unterstützt SVG und web-fonts.

Key features:

  • völlig frei,
  • einfache einrichtung durch kopieren und einfügen link,
  • kommt als webfont,
  • angepasst größen,
  • über 1100 artikel.

Eckige Materialsymbole

Bildquelle: https://material.io/resources/icons/?style=baseline
figcaption>

Material Icon ist kostenlos icon pack von Google., Um die Lesbarkeit und Klarheit zu gewährleisten, wurden diese Symbole so optimiert, dass sie auf allen Plattformen und Displays gut aussehen. Diese materiellen Symbole sind völlig kostenlos und auf GitHub zugänglich. Dieses Icon Pack ist absolut massiv mit über 1.000 Icons für eine breite Palette von Interface-Funktionen.

Alle Symbole sind in fünf Themen. Sie erhalten eine Reihe von herunterladbaren Größen und Dichten. Das beste Format für Webprojekte ist eine einfach zu bedienende Icon-Webschrift.,

Linearicons

Bildquelle:

Linear Icon pack ist eines der beliebtesten und besten Icon Packs für persönliche oder kommerzielle Zwecke. Linear Icon Pack gibt es sowohl in kostenlosen als auch in Premium-Versionen. Die kostenlose Version dieses erstaunlichen Icon Pack kommt unter Creative Common Lizenz. Es gibt auch verschiedene Pakete, die Sie für Ihre Bedürfnisse auswählen können, z. B. das Desktop-Paket.,

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., Dies sind Open-Source-Symbole, die auf einem 24X24-Raster entworfen wurden. Die Symbole sind im SVG-Format verfügbar. Es ist unter der MIT-Lizenz, und es gibt über 250+ Symbole in Open Source.

Die Icons sind einfach zu bearbeiten, sauber und knackig – unabhängig von der Größe. Sie wurden zuerst als Symbolschriftart entwickelt und sollen daher als Webschriftart eingebettet werden.,

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., Es gibt mehrere monatliche Zahlungspläne — von $ 9 bis $ 49. Sie können auch das System „pay as you go“ wählen.

Symboldateien sind in den Formaten SVG, PNG, ICO, ICNS und Adobe Illustrator verfügbar und die Abmessungen liegen zwischen 16×16 und 512×512. Sie können auch mit einigen der besten Designer der Website arbeiten, wenn Sie nicht finden können, etwas, das Sie mögen oder wollen einfach benutzerdefinierte Symbole speziell für Sie und Ihre Marke.,

Hauptmerkmale:

  • sowohl kostenlose als auch kostenpflichtige Optionen,
  • flexible Suchfunktionen,
  • Symbole in einer Vielzahl von Formaten,
  • viele Kategorien und Stile,
  • Symboleditor.

Das Substantiv Projekt

Bildquelle: https://thenounproject.com/

Das Nomen-Projekt bietet eine der größten im Web verfügbaren Symbolbibliotheken., Die meisten Symbole dieser Site sind im SVG-und PNG-Format sowie im Schwarzweißformat verfügbar.

Die Bibliothek der Website besteht aus Symboldateien, die von einer Vielzahl unabhängiger Designer entworfen wurden. Es ist ein Ort, an dem Schöpfer und Kreative zusammenarbeiten können, um ihre Designs zu verkaufen und eine scheinbar endlose Bibliothek mit Premium-Symbolen zu finden.

Das Durchsuchen dieser riesigen und umfassenden Symbolbibliothek ist sehr einfach. Weitere wichtige Funktionen dieser Symbolbibliothek sind kostenlose und Premium-Download-Optionen, viele große Sätze von Symbolen, eine Anwendung für Mac und vieles mehr., Diese Symbolbibliothek wird regelmäßig aktualisiert und täglich werden neue Symbole und Sets veröffentlicht.

Hauptmerkmale:

  • über 150.000 Symbole;
  • SVG, PNG-Formate;
  • Such-und Erkennungstools;
  • Creative Common License mit Premium-Optionen;
  • kostenlose und kostenpflichtige Downloadoptionen;
  • neue Symbole, die nahezu täglich hochgeladen werden.

Fontawesome-Icons

Website: https://fontawesome.com/icons
Format und Typ: SVG, PNG, Icon, font, Marketplace
– Lizenz-und Preisgestaltung: SIL OFL 1.,1

Bildquelle: https://fontawesome.com/icons

Font Awesome ist die am häufigsten verwendete und beliebteste Symbolschriftart. Es ist auch das Standardsymbol für das Team bei Bootstrap. Es ist auch als SVG-Symbole unter anderen Formaten verfügbar.Die Lizenz ist offen und kostenlos für alles, kommerzielle oder persönliche.

Jedes Symbol ist direkt in CSS vollständig skalierbar und wartbar., Sie können Farben, Schatten, Hintergrundverläufe und so ziemlich alles andere mit reinem CSS3 ändern. Ein weiterer Grund für die Verwendung dieser Bibliothek ist, dass sie vollständig optimiert ist und keine Kompatibilitätsprobleme aufweist, da überhaupt kein JavaScript erforderlich ist.

Key Features:

  • Vektor-Schriftart,
  • jedes Symbol kommt mit einer CSS-Klasse & Unicode,
  • frei,
  • gebaut mit Zugänglichkeit im Auge,
  • Features einfache Aktualisierung über Websites,
  • bietet einen Desktop-Spickzettel für die gesamte Icon-Bibliothek.,

Lineicons

Website: https://lineicons.com/
Format und Typ: SVG, Web font, Icon font
Lizenz und Preise: Kostenlos

Bildquelle: https://lineicons.com/

LineIcons bieten auch kostenloses CDN mit übersichtlicher Dokumentation, die den Einstieg erleichtert.

Dieses Icon Pack ist völlig kostenlos und wird mit mehr als 450 Liniensymbolen geliefert., Es deckt jedes einzelne wesentliche Symbol ab, das Sie für das Projekt aus verschiedenen Kategorien benötigen. LineIcons bietet auch kostenloses CDN und eine übersichtliche Dokumentation, um einfach loszulegen. Es kommt mit 2 verschiedenen skalierbaren Paketen-WebFonts und SVG-Dateien, die Sie je nach Projektanforderungen verwenden können.

Key features:

  • 450+ Free Icons
  • SVG-Dateien
  • Web-Schriftart Bereit,
  • Kostenlose CDN.,

Letzte Gedanken

Die Auswahl der richtigen Symbolbibliotheksressource für Ihr Projekt sollte nicht auf dem basieren, was als am beliebtesten angesehen wird, sondern auf dem, was am besten zu den Anforderungen Ihres Projekts passt. Achten Sie bei der Auswahl von Symbolen darauf, wie einfach es ist, ein Projekt zu starten, welche Formate in der Bibliothek vorhanden sind und welchen Preis.

Ein wichtiger Faktor bei der Auswahl eines Icon Packs ist auch der Stil Ihrer Anwendung oder Site.

Wir hoffen, dass dieser Artikel Ihnen bei der Auswahl der für Ihre Bedürfnisse am besten geeigneten Lösung hilft.