Maison > interface Web > js tutoriel > 20 bibliothèques d'icônes ICON de développement front-end qui valent la peine d'être collectées

20 bibliothèques d'icônes ICON de développement front-end qui valent la peine d'être collectées

青灯夜游
Libérer: 2021-02-26 10:27:28
avant
12883 Les gens l'ont consulté

Cet article partagera avec vous 20 bibliothèques d'icônes ICON (à collectionner) pour rendre votre site Web beau et lisible. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. J'espère qu'il sera utile à tout le monde.

20 bibliothèques d'icônes ICON de développement front-end qui valent la peine d'être collectées

La présence d'icônes dans l'interface de l'application donnera aux utilisateurs une bonne première impression, ce qui est très important. Mais développer une icône à partir de zéro demande beaucoup de temps et d’argent. L'utilisation d'icônes sur votre site Web vous permet de communiquer efficacement avec vos visiteurs : elles augmentent la lisibilité, mettent en évidence le contenu important, renforcent les fonctionnalités ou les caractéristiques et améliorent le design. Par conséquent, utiliser des icônes prêtes à l’emploi est un bon choix.

Liste des meilleures bibliothèques d'icônes

Ici, la iconfont d'Alibaba ne sera pas présentée en gros. Les développeurs nationaux le savent tous, et maintenant, allons-y. jetez un œil à quelques bibliothèques d’icônes utiles disponibles à l’étranger.

1. Flaticon

Site Web : https://www.flaticon.com/packs
Format et types : PNG, SVG, EPS, PSD et BASE 64, Marketplace
Prix et licence : Plan gratuit limité et Plan premium à partir de 9,99 $ par mois

20 bibliothèques dicônes ICON de développement front-end qui valent la peine dêtre collectées

Flaticon contient des vecteurs entièrement modifiables qui peuvent être utilisés pour des projets personnels et commerciaux. FlatIcon compte plus de 230 millions d'icônes vectorielles regroupées en 51202 packages

Le produit possède des extensions Adobe qui nous permettent d'importer facilement les icônes Photoshop, Illustrator et After Effects. Si vous souhaitez utiliser une police Web au lieu d'un fichier statique pour afficher votre icône, FlatIcon se chargera de la conversion du format et générera une police Web utilisable. Nous pouvons également personnaliser l'icône téléchargée.

Points forts :

  • Plus de 90,000 icônes
  • Formats SVG, EPS, PSD et PNG ; >Police d'icônes;
  • Extension Adobe pour la suite CC;
  • Licence Linkshare avec options premium;
  • Et de nouveaux packs d'icônes ajoutés chaque mois;

2. Icônes JamSite Web :

https://jam-icons.com/

Formats et types : SVG, CSSPrix et licence : gratuit, MIT

20 bibliothèques dicônes ICON de développement front-end qui valent la peine dêtre collectéesJam Icons est un ensemble de

icônes fabriquées à la main. Ce pack d'icônes fournit des versions

et de police. Ces icônes peuvent être utilisées comme fichiers SVG dans des projets de développement Web, imprimés ou d'applications. Ces icônes peuvent également être utilisées comme polices pour une feuille de style CSS donnée. Disponible en trois tailles : 896, SVG et 16pxx. Nous pouvons également choisir entre des icônes remplies ou barrées. 24px32p

3. Pack d'icônes FontistoSite Web :

https://fontisto.com/

Format et Type : CSS Prix et licence : ree, MIT

20 bibliothèques dicônes ICON de développement front-end qui valent la peine dêtre collectées

Fontisto

est un pack d'icônes vectorielles. Les icônes peuvent être personnalisées instantanément : taille, couleur, ombre et tout ce que CSS peut faire. Ce produit ne nécessite pas Javascript. Les icônes Fontisto sont vectorielles, ce qui signifie qu'elles auront fière allure sur les moniteurs haute résolution. Sur ce site Web, nous pouvons trouver une documentation complète et divers guides sur la façon de lancer et de personnaliser le produit. Il suffit de coller le lien sur le site Web pour commencer à utiliser le produit. De plus, vous pouvez utiliser Fontisto avec un gestionnaire de paquets approprié :

etc.

npm,yarn,bower

4. IconmonstrSite Web :

https://iconmonstr.com/

Formater et saisir : SVG, EPS, PSD et PNG, MarketplacePrix et licence : gratuits

20 bibliothèques dicônes ICON de développement front-end qui valent la peine dêtre collectées

disponibles dans la collection d'icônes Plusieurs icônes. Chaque jeu d'icônes propose des versions de contour et remplies des graphiques pour garantir qu'ils peuvent être utilisés dans une variété d'applications de conception. Chaque icône du site est fournie gratuitement et les fichiers d'icônes sont dans des formats tels que

et Iconmonstr, qui peuvent être utilisés à la fois à des fins gratuites et commerciales. 4400

Iconmonstr simplifie la recherche d'icônes grâce à sa puissante fonctionnalité de recherche. Nous pouvons également enregistrer nos icônes préférées dans nos favoris personnels pour une utilisation future.

Points forts :

  • Accès gratuit à toutes les icônes
  • Options de téléchargement en quatre formats, ainsi que des icônes réduites optimisées pour une utilisation sur le Web

5. Bibliothèque d'icônes matérielles Pixsellz

Site Web : https://icons.pixsellz.io/
Formats et types : SVG, EPS, PSD, PNG, FIG, Conception matérielle
Prix et licence : Gratuit, Licence Apache version 2.0

20 bibliothèques dicônes ICON de développement front-end qui valent la peine dêtre collectées

Un grand nombre de 1000 icônes multiples réparties en 16 différentes catégories. Le pack d'icônes gratuit est inspiré du design Material et présenté dans trois styles visuels différents : cercle, contour et bicolore. Le kit est disponible en 6 formats de fichiers différents afin que nous puissions utiliser les icônes de notre logiciel de conception préféré. 请输入代码

Points forts :

    3 styles
  • Style Figma
  • 1000+ icônes
  • 24× 24 pixels
  • Style de croquis
  • 16 catégories et 6 formats de fichiers

6, Entypo

Site Web :

http://www.entypo.com/Format et type : SVG
Prix et licence : Gratuit, Creative Common License 4.0

20 bibliothèques dicônes ICON de développement front-end qui valent la peine dêtre collectées

Entypo est un produit de la série d'icônes SVG, soigneusement produit par Daniel Bruce de Suède il y a quelques années. Ces icônes sont géniales : elles sont les plus importantes lorsqu'il s'agit de cadeaux. Ce produit est disponible en SVG avec les icônes et est gratuit sous licence Creative Commons. 411

7. Icônes maléfiques

Site Web :

https://evil-icons.io/Format et types : SVG, Sketch
Prix et licence : gratuit, MIT

20 bibliothèques dicônes ICON de développement front-end qui valent la peine dêtre collectées

Cette bibliothèque est énorme et a tout pour plaire - à la fois SVG et original fichier source. Cela signifie que nous pouvons télécharger

ainsi que les fichiers SVG et les Illustrator fichiers de Sketch. .sketch

8. Rationaliser les icônes

Site Web :

https://streamlineicons.com/Formater et saisir : ICONJAR, SKETCH, FIG, XD, SVG, AI, PDF, PNG
Prix et licence : Gratuit à 411 $

20 bibliothèques dicônes ICON de développement front-end qui valent la peine dêtre collectées

Streamline Icons est un inventaire d'icônes gratuit avec une forte compatibilité. La bibliothèque est organisée en `53` catégories et est livrée avec plusieurs icônes vectorielles. 30000

C'est l'un des rares packs d'icônes optimisés pour Sketch, permettant une manipulation facile de la largeur et de la couleur du trait. Les fonctionnalités intégrées de Sketch telles que les symboles et les styles partagés facilitent et accélèrent la réutilisation d'éléments tels que les icônes.

La société dispose de sa propre application Web qui permet de parcourir, rechercher et télécharger des icônes directement depuis le navigateur.

Points forts :

    Plus de
  • icônes vectorielles30000
  • Traits intelligents pour modifier l'épaisseur du contour
  • Support Sketch , AI, EPS, PDF, PNG, SVG
  • Chaque icône de Streamline 3.0 a trois poids uniques : léger, régulier et gras

9.

Site Web :

https://smashicons.com/Format et type : JAR, SVG, AI, SKETCH, Marketplace
Prix et licence : Gratuit jusqu'à 149 $

20 bibliothèques dicônes ICON de développement front-end qui valent la peine dêtre collectées

Smashicons propose plus de icônes dans sa bibliothèque Collection complète d'icônes. 219000+Smashicons fonctionne un peu différemment des autres produits : sa tarification est basée sur un forfait mensuel de 5 $ par mois. Cela signifie que pour seulement 5 $ par mois, vous pouvez accéder à l’intégralité de leur collection d’icônes existantes ainsi qu’à toutes les futures icônes qu’ils publieront.

Points forts :

  • Une très grande collection d'icônes
  • Il existe des icônes compatibles avec plusieurs plates-formes
  • Application Web facile à utiliser pour rechercher et trouver les icônes dont vous avez besoin
  • Modèle économique basé sur l'abonnement
  • Support multiplateforme

10, Icons8

Site Web : https ://icons8.com/
Formats et types : SVG, PNG, PDF
Prix et licence : Licence Good Boy, gratuite jusqu'à 19,90 $

20 bibliothèques dicônes ICON de développement front-end qui valent la peine dêtre collectées

Icons8 est livrée avec plus de icônes couvrant plusieurs catégories. Des environnements d'entreprise et de bureau aux personnes, en passant par la nourriture et les icônes des médias sociaux. Ces icônes sont conçues pour imiter l'apparence d'un système d'exploitation spécifique. Nous pouvons les télécharger dans les versions Windows, iOS et Android. 120000

Points forts :

    Formats SVG, PNG et HTML
  • Fournit différents styles d'icônes tels que des icônes linéaires, des icônes solides et des icônes complètes Coloré
  • Toutes les icônes disponibles en téléchargement via fichier .zip
  • Modifiable avant le téléchargement
  • Options d'abonnement gratuites et payantes

11. Icomoon

Site Web :

https://icomoon.io/Format et type : SVG, PNG, PDF
Prix et licence : Gratuit à 139,90$

120 bibliothèques dicônes ICON de développement front-end qui valent la peine dêtre collectées

Icomoon est un outil complet de gestion d'images et d'icônes. Ce produit propose des solutions de haute qualité pour l'édition et la gestion des icônes. Les icônes Icomoon sont fabriquées à la main sur la grille et disponibles aux formats 16X16 et SVG,EPS,PSD,PDF. Le jeu d'icônes est également constamment mis à jour par son créateur. AI

Chaque pack d'icônes est livré avec une licence détaillée afin que les concepteurs et les développeurs sachent exactement comment utiliser les icônes. Les utilisateurs peuvent également personnaliser leurs propres polices d'icônes.

Points forts :

    Outil complet de gestion des icônes
  • Options de téléchargement gratuites et payantes
  • Plusieurs formats de téléchargement

12. Pack d'icônes Glyphish

Site Web :

http://www.glyphish.com/ Formats et types : SVG, PNG, PDF, PSD, Glyphe, police d'icônes
Prix et licence : Creative Common Attribution, de 25 $ à 99 $

120 bibliothèques dicônes ICON de développement front-end qui valent la peine dêtre collectées

Glyphish fournit une variété de bibliothèques d'icônes différentes. Chaque bibliothèque est disponible dans une variété de formats différents, notamment , PNG, SVG et PSD. Les icônes de base sont disponibles pour 25 $, tandis que le pack d'icônes final a un prix régulier de 99 $. La démo gratuite contient des icônes AI. Les concepteurs peuvent facilement modifier toutes les icônes. 50

Points forts :

    Icônes pour plusieurs plateformes : iOS, Android, Web, Window
  • Un ensemble de 50 icônes gratuites
  • Faites glisser et déposez dans Xcode
  • Icônes pour l'écran Apple Retina

13, Ionicons

Site Web :

https://ionicons.com/Formats et types : SVG et Webfont, Police d'icônes
Prix et licence : MIT

120 bibliothèques dicônes ICON de développement front-end qui valent la peine dêtre collectées

L'équipe Ionic a décidé de publier ses icônes sous la forme d'une police Web appelée

Ionicons. Bien entendu, ils sont entièrement gratuits et disponibles sur . Nous pouvons même ajouter ces icônes directement sur votre site en utilisant la version GitHubCDN de la feuille de style, qui prend également en charge les polices SVG et Web.

Points forts :

    Entièrement gratuit
  • Facile à configurer en copiant et collant le lien
  • Apparaît comme un police Web
  • Taille personnalisée
  • Plus de 1100 éléments

14. 🎜> URL : https://material.io/resources...Formats et types : SVG, Webfont, Material design

Prix et licence : Gratuit, Apache License 2.0



Material Icon est une bibliothèque d'icônes gratuite fournie par Google. Pour garantir la lisibilité et la clarté, ces icônes ont été optimisées pour s'afficher parfaitement sur toutes les plateformes et tous les écrans. Ces icônes sont entièrement gratuites et accessibles sur GitHub. Cette bibliothèque d'icônes est vaste, avec plus de 1,000 icônes couvrant un large éventail de fonctions d'interface.

15. Linearicons

Site Web : https://linearicons.com/
Formater et saisir : SVG, Webfont, Icon font
Prix et licence : gratuit jusqu'à 59 $, licence de création commune

120 bibliothèques dicônes ICON de développement front-end qui valent la peine dêtre collectées

Linearicons en est une des packs d'icônes les plus populaires et les meilleurs à des fins personnelles ou commerciales. Les icônes linéaires sont disponibles en versions gratuite et premium, et la version gratuite de cet incroyable pack d'icônes est sous licence Creative Commons. Nous pouvons également choisir d'autres forfaits selon nos besoins, comme "Desktop Package".

Points forts :

  • CloudFront CDN
  • Propose une version gratuite
  • avec différents formats : SVG, PDF, Webfont .

16. Feathericons

Site Web : https://feathericons.com/
Format et types : SVG, Webfont, Iconfont
Prix et licence : gratuite, la licence MIT

120 bibliothèques dicônes ICON de développement front-end qui valent la peine dêtre collectées

Feather est la plus L'un des jeux d'icônes open source les plus populaires. Ce sont des icônes open source conçues sur la grille 24X24. Ces icônes sont fournies au format SVG. Il est sous licence MIT et possède environ 250 plusieurs icônes en open source.

Les icônes sont faciles à modifier et semblent claires, quelle que soit leur taille. Elles ont d'abord été conçues comme une police d'icônes, elles sont donc intégrées en tant que police Web.

17. Iconfinder

Adresse Webhttps://www.iconfinder.com/
Formater et type : SVG, PNG, ICO, Marketplace
Prix et licence : 9 $ à 49 $ par mois

120 bibliothèques dicônes ICON de développement front-end qui valent la peine dêtre collectées

IconfinderEst l'une des ressources d'icônes les plus populaires sur le Web. Il fournit plus de 400 millions d'icônes et offre aux utilisateurs diverses options de recherche, notamment le format de l'icône, le prix, la taille, l'arrière-plan, etc. Il existe également plusieurs plans de paiement mensuels - de à . On peut également opter pour un système « pay as you go ». Les fichiers d'icônes

sont disponibles aux formats SVG,PNG,ICO,ICNS et Adobe Illustrator, avec des tailles allant de 16×16 à 512×512. Si vous ne trouvez pas quelque chose que vous aimez ou si vous souhaitez simplement une icône personnalisée conçue spécifiquement pour notre marque, vous pouvez également travailler avec certains des meilleurs designers du site.

Points forts :

  • Options d'utilisation gratuites et payantes
  • Fonctionnalité de recherche flexible
  • Icônes disponibles dans plusieurs formats
  • De nombreuses catégories et styles
  • Éditeur de marques

18 The Noun Project

Site Web : https://thenounproject.com/
Formats et types : SVG, PNG, Marketplace
Prix et licence : Creative Commons License

120 bibliothèques dicônes ICON de développement front-end qui valent la peine dêtre collectées

Noun Project propose l'une des plus grandes bibliothèques d'icônes du Web. La plupart des icônes du site sont disponibles aux formats SVG et PNG, ainsi qu'en styles noir et blanc.

La bibliothèque du site Web se compose d'une variété de fichiers d'icônes conçus par des designers indépendants. Ici, les créateurs et les professionnels de la création peuvent collaborer pour vendre leurs créations et trouver une bibliothèque apparemment infinie d'icônes premium.

La recherche dans cette bibliothèque d'icônes vaste et complète est facile. Les autres fonctionnalités clés de cette bibliothèque d'icônes incluent des options de téléchargement gratuites et premium, de nombreux grands jeux d'icônes, des applications pour Mac, etc. La bibliothèque d'icônes est mise à jour régulièrement, avec de nouvelles icônes et ensembles publiés quotidiennement.

Points forts :

  • Plus de 150,000 icônes
  • Formats SVG, PNG
  • Outils de recherche et de découverte
  • Options de téléchargement gratuites et payantes
  • Nouvelles icônes téléchargées presque tous les jours

19. Icônes Fontawesome

Site Web : https://fontawesome.com/icons
Formats et types : SVG, PNG, police d'icônes, Marketplace
Prix et licence : SIL OFL 1.1

20 bibliothèques dicônes ICON de développement front-end qui valent la peine dêtre collectées

Font Awesome est la police d'icônes la plus utilisée et la plus populaire. Il s’agit également de l’icône par défaut définie pour Teams au démarrage. Il est également disponible sous forme d’icône SVG ainsi que dans d’autres formats. Cette licence est gratuite pour toute utilisation commerciale ou personnelle.

Chaque icône est entièrement évolutive et peut être gérée directement en CSS. Nous pouvons changer les couleurs, les ombres, les dégradés d'arrière-plan et à peu près tout ce qui est en utilisant CSS3 simple. Une autre raison d'utiliser cette bibliothèque est qu'elle est entièrement optimisée et ne nécessite aucun JavaScript, il n'y a donc aucun problème de compatibilité.

Points forts :

  • Polices vectorielles
  • Chaque icône est livrée avec des classes CSS et Unicode
  • Gratuit
  • Construit dans un souci d'accessibilité
  • Facile à mettre à niveau sur tous les sites
  • Aide-mémoire de bureau avec bibliothèque complète d'icônes disponible

20.

Site Web : https://lineicons.com/
Format et type : SVG, police Web, police d'icône
Prix et licence : Gratuit

20 bibliothèques dicônes ICON de développement front-end qui valent la peine dêtre collectées

LineIcons propose également un CDN gratuit avec une documentation claire, facilitant la prise en main.

Ce pack d'icônes est entièrement gratuit et est livré avec 450 icônes à plusieurs lignes. Il couvre toutes les icônes de base requises pour les projets de différentes catégories. LineIcons fournit également un CDN gratuit et une documentation claire pour faciliter la prise en main. Il est livré avec 2 packages évolutifs différents – des fichiers WebFonts et SVG qui peuvent être utilisés en fonction des besoins de votre projet.

Points forts :

  • 450+ icônes gratuites
  • Fichiers SVG
  • CDN gratuit

Résumé

Lors du choix d'une bibliothèque d'icônes, cela ne doit pas être basé sur la popularité de la bibliothèque d'icônes, mais sur quelle bibliothèque d'icônes est la plus adaptée au contexte actuel projet de développement, lequel Le style de la bibliothèque d'icônes est plus conforme au style de notre application.

J'espère que cet article vous aidera à choisir la solution la mieux adaptée à vos besoins.

Adresse originale en anglais : https://blog/top-icons-packs-and-resources-for-web/

Auteur : Eugene Stepnov

Traduction Adresse : https://segmentfault.com/a/1190000022273604

Pour plus de connaissances sur la programmation, veuillez visiter : Vidéo de programmation ! !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:segmentfault.com
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal