Set gratuito de iconos transformables [CSS3 + JavaScript]

Marka es un bonito set de recursos que emplean el concepto de transformación-mutación y se encuentra en una etapa experimental. En resumidas cuentas este conjunto de iconos cuenta con la capacidad de mutar, por ejemplo, un icono que representa un + (agregar) puede cambiar a un – (quitar o eliminar).

El cambio se realiza por medio de una animación bastante bien lograda, para crear esta animación se utiliza CSS3 y JavaScript. Su utilización es extremadamente sencilla, no requiere complejas instrucciones, apenas vamos a necesitar unas pocas lineas de código para emplear este recurso.

iconos css3 transformables

El set se encuentra compuesto por un total de 36 iconos distintos listos para utilizar, los mismos se pueden combinar de distintas formas, actualmente tenemos tres formatos distintos para emplear como fondo: cuadrado, triángulo y circulo. Estos permite generar muchos más iconos simplemente realizando combinaciones de los disponibles en el recurso.

Ejemplo de uso:

var m = new Marka('#icon');
m.set('circle')
    .color('#FF6600')
    .size('50');

El color de los iconos se modifica por medio de hojas de estilo (también se puede definir desde JavaScript como se ve en el ejemplo), si alguna vez utilizaron Font-Awesome o Bootstrap (Glyphyicons) no tendrán ningún problema para aplicar estos iconos a sus proyectos.

A la hora de descargar Marka tenemos dos opciones: descargar el set completo, o bien, realizar la descarga selectiva, en el sitio oficial pueden generar una descarga personalizada seleccionando solamente los iconos que van a necesitar, evitando sobrecargar nuestro proyecto con un peso innecesario.

Web: Marka

Categorizado en: