Fuentes que en lugar de letras o números están llenas de íconos y gráficos, es básicamente una fuente icónica que puede usar en sus proyectos web en lugar de usar imágenes para sus íconos. Para usar una fuente de icono, solo necesita incrustar la fuente web de icono con CSS, luego seleccionar el icono del mapa de caracteres, normalmente con una clase específica en un elemento i
o span
para que el icono se muestre en el elemento.
En esta parte superior, compartiremos contigo 10 de las fuentes de iconos más modernas y fáciles de usar que puedes usar en tus nuevos proyectos para crear aplicaciones interactivas e intuitivas.
10. Line Awesome
Line awesome es una fuente de iconos que se puede usar como reemplazo de Font Awesome con iconos de líneas modernas usando una sola línea de código. Ofrece una amplia gama de temas como médico, marca, video, direccional, edición de texto, gráficos, controles de formulario, íconos de transporte y mucho más.
9. Icono
Icono es una biblioteca de iconos ligera que te permite mostrar bonitos iconos con un solo, sin fuente ni svg, solo CSS puro.
8. Devicons
Devicons, es una fuente icónica hecha para desarrolladores, código jedis, ninjas, HTTPsters, evangelistas y nerds (sic). Ofrece más de 100 iconos listos para usar en su próximo proyecto. Creado, hecho a mano y codificado por Theodore Vorillas Devicons contiene 85 glifos afilados vectorizados. La fuente icónica Devicons es de uso gratuito y tiene licencia del MIT .
7. Apilar iconos
Los Stackicons son fuentes de iconos para la web, diseñadas para hacer más:con múltiples formas de botones y una opción única de "multicolor" . La fuente Stackicons-Social y el kit de construcción basado en Sass son gratuitos y de código abierto, creados por Parker Bennett .
6. Genericons
Genericons es un increíble kit de iconos de aspecto genérico y ligero, adecuado para un blog o un sitio web sencillo.
5. Iconos de plumas
Feather es una colección de iconos de código abierto simplemente hermosos. Cada ícono está diseñado en una cuadrícula 24x24 con énfasis en la simplicidad, consistencia y legibilidad. En esencia, Feather es una colección de archivos SVG. Esto significa que puede usar los íconos de Plumas de la misma manera que puede usar SVG (por ejemplo, img, imagen de fondo, en línea, objeto, incrustado, iframe).
4. Iconos de material design
Material Design Icons es una enorme colección de más de 2400 iconos de la comunidad. La creciente colección de iconos de Material Design Icons permite a los diseñadores y desarrolladores que se dirigen a varias plataformas descargar iconos en el formato, color y tamaño que necesitan para cualquier proyecto.
3. Octicons
Octicons es un conjunto escalable de iconos creados a mano por el equipo de GitHub , basados ââprincipalmente en SVG.
2. Ionicons
Ionicons es un ícono de diseño premium de código abierto (con licencia MIT) para su uso en aplicaciones web, iOS, Android y de escritorio. Ionicons se creó para Ionic Framework, por lo que los íconos tienen versiones de Material Design y iOS. Cuando se usa con Ionic, el componente ion-icon usará automáticamente la versión correcta según su plataforma. Además, cuando se usa fuera de Ionic, la aplicación puede elegir las plataformas ios y md.
1. Font Awesome
Font Awesome 4 es un conjunto completo de 675 iconos pictográficos para gráficos vectoriales escalables fáciles en sitios web, creado y mantenido por Dave Gandy. Después de ser utilizado por muchos desarrolladores y diseñadores web, Font Awesome se rediseñó y construyó desde cero, publicando Font Awesome 5. Además de esto, características como ligaduras de fuentes de iconos, un marco SVG, paquetes oficiales de NPM para bibliotecas frontend populares como React, y acceso a un nuevo CDN.
Si conoce otra fuente web icónica de código abierto increíble, compártala con la comunidad en el cuadro de comentarios.
Conviertete en un programador más sociable