Material Icons

Los iconos del sistema de diseño “Material Icons” son simples, modernos y en algunos casos extrafalario. Cada icono está creado usando una guías de diseño para representar en formas simples los conceptos universales comunes de una interfaz de usuario. Son iconos que han sido optimizados para visualizarse en distintos tamaños para todas las plataformas y resoluciones de pantalla.

Los iconos están disponibles en varios formatos y son adecuados para diferentes tipos de proyectos. Está pensando para que los desarrolladores puedan incluirlos en sus aplicaciones y para que los diseñadores puedan usarlos en sus maquetas o diseños.

material-icons

Esta librería de iconos nos llama especialmente la atención por su simplicidad de uso, además de que se ven perfectamente y son eficientes para el rendimiento de la Web. Dispone de más de 900 iconos distintos, cuenta con el apoyo de todos los navegadores Web modernos. El color, tamaño y posición es personalizable a través de css. Está basado en vectores, se ve muy bien en cualquier escala.

Estos iconos forman parte de una fuente que está disponible en Google y se puede incluir fácilmente en vuestra Web con tan solo añadir la fuente en vuestra cabecera <head>:

<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

Después tan solo debes incluir el objeto icon dentro del <body> donde desees verlo. Por ejemplo, si queremos mostrar el icono del carrito:

<i class="material-icons">shopping_cart</i>

Para Internet Explorer 9 o inferior:

<i class="material-icons">&#xE8CC;</i>

Ver ejemplo en funcionamiento

Ver todos los iconos de esta fuente

Autor
Escrito por Jose Aguilar - Director ejecutivo y tecnológico en JA Modules. Experto programador PrestaShop y Experto programador WordPress.
Te ha servido? Valora esta entrada!
1 estrella2 estrellas3 estrellas4 estrellas5 estrellas (3 votos, promedio: 5,00 de 5)
Cargando…
Comparte en las redes sociales

3 respuestas a “Material Icons”

  1. Pier Hoans dice:

    Por ejemplo yo deseo colocar un material icons en el menu principal , pero no se como ubicar el archivo .html para agregar el material icons

  2. Pier Hoans dice:

    Hola hermano lindo te saluda Pier , una consulta con respecto al tema, me gustaria saber como ubicar el archivo .html donde debo colocar estos material icon, todo esto en prestashop.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Ver más sobre