Anastasia Ovchinnikova

Seguir

Apr 5, 2020 · 13 min leer

Los iconos tienen un papel importante en dar la primera impresión del sitio o de la interfaz de la aplicación. Pero se necesita mucho tiempo y dinero para desarrollarlos desde cero., El uso de iconos en su sitio le permite comunicarse eficazmente con sus visitantes: aumentan la legibilidad, resaltan el contenido importante, refuerzan la funcionalidad o las características y mejoran el diseño. Por lo tanto, vale la pena prestar atención a los mejores paquetes de iconos ya hechos.

También, cuando se trata de diseño de iconos, esta es una gran manera para mostrar el diseñador de cualificaciones., Un paquete de iconos dulce y agradable es un escaparate perfecto del trabajo del diseñador y un poderoso instrumento para construir su reputación en línea.

Aquí hay algunas grandes ventajas de usar iconos en su próximo proyecto de diseño de experiencia de usuario.

  • Los iconos ayudan a aumentar la legibilidad del sitio o la aplicación.
  • Los iconos bien hechos ayudan a reducir el volumen del texto. El uso de iconos hace que su mensaje sea comprensible sin texto.
  • Los iconos pueden agregar personalización a su producto.
  • Los iconos pueden ser un buen punto de partida para conocer el producto.,
  • Por último, pero no menos importante: una de las funciones más importantes de los iconos es ayudar a los usuarios a comprender intuitivamente la aplicación tanto en el primer conocimiento como durante el uso posterior.

en este artículo, encontrarás una colección de algunos de los mejores paquetes de iconos que puedes usar en tu sitio web o negocio, incluso si no eres un artista creativo. Los productos presentados en este artículo pueden ser utilizados no solo en sitios web comunes y en casos básicos, sino también en otros más complejos y especializados.

dividimos los productos en varias categorías para su facilidad., Antes de las descripciones, verá la categoría a la que pertenece este producto.

  • conjuntos de iconos gratuitos.
  • mercados. El mercado contiene iconos de diferentes fabricantes. Aquí puede encontrar productos baratos y caros, así como productos de buena y baja calidad.
  • conjuntos de iconos de Material design y conjuntos de iconos planos.
  • conjuntos de iconos CSS. Los iconos CSS se hacen usando-guess what-CSS. Para usarlos, simplemente copia el código a tu página.
  • Fuentes de iconos. Según Pluralsight, las fuentes icon son fuentes reales que contienen símbolos y glifos en lugar de letras o números., Son populares para los diseñadores web, ya que puedes darles estilo con CSS de la misma manera que el texto normal. Los navegadores tratan las fuentes de iconos como texto, por lo que deberá normalizarlas para evitar problemas de suavizado de texto, y son compatibles con casi todos los navegadores.
  • iconos SVG. Scalable Vector Graphics (SVG) es un formato de gráficos vectoriales basado en XML que puede escalar a cualquier tamaño sin perder claridad. Se pueden mostrar a través de CSS, etiquetas de objetos, etiquetas de imágenes o en línea directamente en su HTML.
  • conjuntos de iconos de Glifos y pictogramas.,

Flaticon

fuente de la Imagen: https://www.flaticon.com/packs

Flaticon contiene completamente en vectores editables y pueden ser utilizados tanto para proyectos personales y comerciales. FlatIcon tiene más de 2,3 millones de iconos vectoriales agrupados en 51202 paquetes.

El producto tiene la extensión Adobe que le permite importar fácilmente iconos dentro de Photoshop, Illustrator y After Effects., Si desea utilizar una fuente web en lugar de archivos estáticos para sus iconos, FlatIcon se encargará de la conversión de formato y generará una fuente web lista para usar. También puede personalizar los iconos descargados.

hechos clave:

  • Más de 90.000 iconos;
  • formatos SVG, EPS, PSD y PNG;
  • Fuentes de iconos;
  • extensión de Adobe para CC suite;
  • licencia Linkshare con opciones premium; y
  • nuevos paquetes de iconos se añaden cada mes.,

una suscripción premium Con FlatIcon le proporcionará derechos de licencia completos, acceso a contenido exclusivo, sin anuncios, Aplicaciones MacOS y extensiones de Adobe, así como la capacidad de crear colecciones ilimitadas.,

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., Los iconos también se pueden usar como fuente con las hojas de estilo CSS dadas. Hay tamaños de 16px, 24px y 32px. También puede elegir rellenar o marcar iconos.

Fontisto Icon Pack

página Web: https://fontisto.com/
Formato y Tipo: CSS
el Precio y la Licencia: Libre, MIT

fuente de la Imagen: https://fontisto.com/

Fontisto es un vector iconos pack., Los iconos se pueden personalizar al instante: tamaño, color, sombra paralela y cualquier cosa que se pueda hacer con el poder de CSS. El producto no requiere Javascript. Los iconos Fontisto son vectores, lo que significa que se verán bien en monitores de alta resolución.

en el sitio web, puede encontrar documentación completa y varias guías sobre cómo iniciar y personalizar el producto. Puede comenzar a usar el producto simplemente pegando el enlace en su sitio web. Además, puede usar Fontisto con los administradores de paquetes que son adecuados para usted: npm, yarn,bower, etc.,

Iconmonstr

página Web: https://iconmonstr.com/
Formato y Tipo: SVG, EPS, PSD y PNG, el Mercado
el Precio y la Licencia: Gratis

fuente de la Imagen: https://iconmonstr.com/

Iconmonstr la colección de iconos ha 4400+ iconos. Cada conjunto de iconos ofrece tanto contornos como versiones completas de los gráficos para garantizar que se puedan usar para una variedad de aplicaciones de diseño., Cada icono en este sitio está disponible de forma gratuita, y los archivos de iconos vienen en formatos como SVG, AI, PSD y PNG. Los archivos se pueden utilizar con fines gratuitos y comerciales.

Iconmonstr facilita la búsqueda de iconos, a través de su potente función de búsqueda. Incluso puede guardar sus iconos favoritos en una colección personal para uso futuro.

Características principales:

  • uso gratuito de todos los iconos,
  • cuatro opciones de descarga de formato y
  • iconos reducidos optimizados para uso web.,

Pixsellz Material de la Biblioteca de Iconos

fuente de la Imagen: https://icons.pixsellz.io/

Un fajo enorme de más de 1000 iconos divididos en 16 categorías diferentes. El paquete de iconos gratuito está inspirado en el diseño de materiales y se presenta en tres estilos visuales diferentes: redondeado, contorno y dos tonos., El conjunto está disponible en 6 formatos de archivo diferentes, por lo que puede utilizar los iconos en su software de diseño preferido.

características principales:

  • 3 estilos,
  • Figma estilos,
  • 1000+ iconos,
  • 24×24 píxeles,
  • Dibujo de estilos y símbolos,
  • 16 categorías, y
  • 6 formatos de archivo.

Entypo

sitio Web: http://www.entypo.com/
formato y tipo: SVG
precio y Licencia: Licencia Libre, creativa común 4.,0

fuente de la Imagen: http://www.entypo.com/

Entypo es un svg familia icon pack, diseñado cuidadosamente un par de años por Daniel Bruce en Suecia. Estos iconos son excelentes: cuando se trata de regalos, son lo mejor. El producto viene como SVG con 411 iconos, gratis con una licencia Creative Commons.,

el autor dice que construir una fuente toma mucho tiempo y es mejor dedicar tiempo a desarrollar nuevos pictogramas.

Mal Iconos

página Web: https://evil-icons.io/
Formato y Tipo: SVG, Dibujo
el Precio y la Licencia: Libre, MIT

fuente de la Imagen: https://evil-icons.io/

Este paquete es absolutamente enorme y viene con todo — incluyendo SVGs y los archivos originales., Eso significa que puede descargar SVGs junto con archivos para Illustrator y el.archivos de sketch para Sketch.

Cada icono sigue el estilo de línea delgada y son perfectos para la mayoría de los sitios web. El hecho de que pueda editar la fuente original los hace aún más valiosos.,

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

Este es uno de los pocos paquetes de iconos optimizados para Sketch, lo que facilita la manipulación de anchos de trazo y colores. Las funciones de croquis integradas, como símbolos y estilos compartidos, hacen que reutilizar elementos, como iconos, sea un proceso rápido y fácil.

la compañía tiene su propia aplicación web que ayuda a navegar, buscar y descargar iconos directamente desde el navegador.,

Características principales:

  • Más de 30000 iconos vectoriales organizados;
  • Trazos inteligentes para modificar el grosor del contorno;
  • Sketch, AI, EPS, PDF, PNG, SVG;
  • aplicación web para buscar y editar iconos;
  • Cada icono en Streamline 3.0 tiene tres pesos únicos: ligero, regular y negrita.,

Smashicons

página Web: https://smashicons.com/
Formato y Tipo: JAR, SVG, AI, CROQUIS, en el Mercado
el Precio y la Licencia: Libre a $149

fuente de la Imagen: https://smashicons.com/

Smashicons ofrece una completa colección de iconos con más de 219000+ iconos en su biblioteca. Smashicons funciona un poco diferente que otros: su precio se basa en un plan mensual de 5 5/mes., Esto significa que por 5 5 al mes se obtiene acceso a toda su colección de iconos existentes, así como cualquier futuro iconos que liberan.

Características principales:

  • Una gran colección de iconos,
  • todos los iconos son compatibles con múltiples plataformas,
  • aplicación web fácil de usar para buscar y encontrar los iconos que necesita,
  • Modelo de negocio basado en suscripción,
  • soporte multiplataforma.

Icons8

sitio Web: https://icons8.com/
formato y tipo: SVG, PNG, PDF
licencia y precios: Good Boy License, gratis a 19.,90 por Mes

uente de la imagen: https://icons8.com/

el conjunto de iconos de Icons8 viene con más de 120000 iconos que cubren varias categorías; desde configuraciones de negocios y oficinas hasta iconos de personas, Alimentos y redes sociales. Los iconos están diseñados para imitar el aspecto de un sistema operativo específico. Puede descargarlos en las versiones de Windows, iOS y Android.,

Los iconos funcionan con Sketch, Photoshop y Xcode. Puede utilizar un editor web antes de descargar los iconos a su sistema.

Características principales:

  • formatos SVG, PNG y HTML;
  • iconos disponibles en diferentes estilos, como icono de línea, icono lleno y a todo color;
  • todos los iconos se pueden descargar a través de .archivo zip;
  • editar antes de descargar;
  • ambas opciones de suscripción gratuita y de pago.,

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., Los iconos Icomoon han sido hechos a mano en una cuadrícula de 16X16 y están disponibles en formatos SVG, EPS, PSD, PDF y AI. El conjunto de iconos también se actualiza constantemente por sus creadores.

Cada paquete de iconos cuenta con licencias detalladas para que los diseñadores y desarrolladores sepan exactamente cómo se pueden usar los iconos. Los usuarios también pueden crear sus propias fuentes de iconos personalizadas.

Características principales:

  • herramientas integrales de gestión de iconos,
  • opciones de descarga gratuitas y de pago,
  • Una amplia variedad de formatos de descarga,
  • actualizaciones gratuitas y fáciles.,

Glyphish Icon Pack

fuente de la Imagen: http://www.glyphish.com/

Glyphish ofrece una variedad de diferentes paquetes de iconos. Cada paquete viene en una variedad de formatos diferentes, incluyendo PNG, SVG, PSD y AI. El paquete básico de iconos está disponible por $25 mientras que el ultimate one está disponible a un precio regular de 9 99. La demo gratuita incluye 50 iconos. Todos los iconos pueden ser editados fácilmente por los diseñadores.,

Características principales:

  • iconos para varias plataformas: iOS, Android, Web, Windows;
  • Un conjunto de 50 iconos gratuitos;
  • fácil arrastrar y soltar en Xcode;
  • iconos de tamaño especial para pantallas Retina de Apple.,

Ionicons

página Web: https://ionicons.com/
Formato y Tipo: SVG y Webfont, Icono de la fuente
Licencia: MIT

fuente de la Imagen: https://ionicons.com/

El Iónica equipo decidió la liberación de sus iconos como una webfont llamado Ionicons. Naturalmente, son totalmente gratis y están disponibles en GitHub. Incluso puede agregar estos iconos directamente a su sitio usando la versión CDN de la hoja de estilos., Es totalmente compatible con fuentes SVG y Web.

características principales:

  • completamente gratis,
  • fácil instalación con copiar y pegar el enlace,
  • viene como una webfont,
  • tamaños personalizados,
  • más de 1100 elementos.

Angulares Material Iconos

fuente de la Imagen: https://material.io/resources/icons/?style=baseline

Material Icono de iconos gratis pack de Google., Para garantizar la legibilidad y claridad, estos iconos se han optimizado para que se vean muy bien en todas las plataformas y pantallas. Estos iconos de material son totalmente gratuitos y accesibles en GitHub. Este paquete de iconos es absolutamente masivo con más de 1,000 iconos que cubren una amplia gama de características de la interfaz.

Todos los símbolos están disponibles en cinco temas. Obtendrá una gama de tamaños y densidades descargables. El mejor formato para proyectos web es una fuente web de iconos fácil de usar.,

Linearicons

fuente de la Imagen: https://linearicons.com/

Lineal Icon pack es uno de los más populares y mejores paquetes de iconos con fines personales o comerciales. Linear icon pack viene en versiones gratuitas y premium. La versión gratuita de este increíble paquete de iconos viene bajo la Licencia Creative Common. También hay diferentes paquetes que puede elegir para sus necesidades, como el paquete de Escritorio.,

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., Estos son iconos de código abierto que han sido diseñados en una cuadrícula de 24X24. Los iconos están disponibles en formato SVG. Está bajo la licencia MIT, y hay alrededor de 250 + iconos en código abierto.

Los iconos son fáciles de editar, limpios y nítidos, independientemente del tamaño. Fueron diseñados como una fuente de icono primero, por lo que está destinado a ser incrustado como una fuente 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., Hay varios planes de pago mensual — de 9 9 a 4 49. También puede elegir el sistema» pay as you go».

Los archivos de iconos están disponibles en los formatos SVG, PNG, IC, ICNS y Adobe Illustrator, y las dimensiones oscilan entre 16×16 y 512×512. También puedes trabajar con algunos de los mejores diseñadores del sitio si no puedes encontrar algo que te guste o simplemente quieres iconos personalizados diseñados especialmente para ti y tu marca.,

Características principales:

  • opciones de uso gratuito y de pago,
  • Funciones de búsqueda flexibles,
  • iconos disponibles en una variedad de formatos,
  • Muchas categorías y estilos,
  • editor de iconos.

El nombre del Proyecto

fuente de la Imagen: https://thenounproject.com/

El nombre del Proyecto ofrece una de la más grande de las bibliotecas de iconos disponibles en la web., La mayoría de los iconos de este sitio están disponibles en formatos SVG y PNG, así como en estilos en blanco y negro.

la biblioteca del sitio se compone de archivos de iconos diseñados por una variedad de diseñadores independientes. Es un lugar donde creadores y profesionales creativos pueden colaborar para vender sus diseños y encontrar una biblioteca aparentemente interminable de iconos premium.

buscar en esta enorme y completa biblioteca de iconos es muy fácil. Las características clave adicionales de esta biblioteca de iconos incluyen opciones de descarga gratuitas y premium, muchos conjuntos grandes de iconos, una aplicación para Mac y más., Esta biblioteca de iconos se actualiza regularmente, y se publican nuevos iconos y conjuntos todos los días.

Características principales:

  • Más de 150.000 iconos;
  • SVG, formatos PNG;
  • Herramientas de búsqueda y descubrimiento;
  • Licencia Creative Common con opciones premium;
  • opciones de descarga gratuitas y de pago;
  • nuevos iconos subidos casi a diario.

Fontawesome Icons

sitio Web: https://fontawesome.com/icons
formato y tipo: SVG, PNG, Icon font,Marketplace
licencia y precios: SIL OFL 1.,1

fuente de la Imagen: https://fontawesome.com/icons

Fuente Impresionante es el más utilizado y el más popular icono de la fuente de todo. También es el icono predeterminado establecido para el equipo en bootstrap. También está disponible como iconos SVG entre otros formatos.La licencia es abierta y gratuita para cualquier cosa, comercial o personal.

Cada icono es totalmente escalable y se puede mantener directamente en CSS., Puedes cambiar colores, sombras, degradados de fondo y casi cualquier otra cosa usando CSS3 puro. Otra razón para usar esta biblioteca es que está totalmente optimizada y no tiene problemas de compatibilidad porque no requiere JavaScript en absoluto.

Características principales:

  • Vector Font,
  • Cada icono viene con una clase CSS&Unicode,
  • gratis,
  • construido con la accesibilidad en mente,
  • Características de fácil actualización a través de sitios web,
  • ofrece una hoja de trucos de escritorio para toda la biblioteca de iconos.,

Lineicons

página Web: https://lineicons.com/
Formato y Tipo: SVG, en la Web de la fuente, Icono de la fuente
Licencia y Precios: Gratis

fuente de la Imagen: https://lineicons.com/

LineIcons también ofrecen conexión CDN con una documentación clara que hace que sea fácil para empezar.

Este paquete de iconos es completamente gratuito y viene con más de 450 iconos de línea., Cubre cada icono esencial que necesita para el proyecto de diferentes categorías. LineIcons también proporciona CDN gratis y documentación clara para comenzar fácilmente. Viene con 2 paquetes escalables diferentes: WebFonts y archivos SVG que puede usar dependiendo de las necesidades de su proyecto.

Características principales:

  • Más de 450 iconos gratuitos,
  • archivos SVG,
  • Fuente web Lista,
  • CDN gratis.,

Pensamientos finales

elegir el recurso de biblioteca de iconos adecuado para su proyecto no debe basarse en lo que se considera más popular, sino más bien en lo que mejor se adapte a las necesidades de su proyecto. Al elegir iconos, preste atención a lo fácil que es iniciar un proyecto, qué formatos están presentes en la biblioteca y el precio.

además, un factor importante al elegir un paquete de iconos será que coincida con el estilo de su aplicación o sitio.

esperamos que este artículo le ayude a elegir la solución más adecuada para sus necesidades.