Iconos diseñados solo con CSS

Cikonss es otra colección de iconos para utilizar en nuestros proyectos, pero con una diferencia, están creados utilizando solamente hojas de estilo.

Este recurso no se trata de otra webfont, son iconos generados utilizando puro y duro CSS, una forma sencilla de reducir las llamadas al servidor, economizar transferencia de datos y agilizar el desarrollo. Su utilización radica en simplemente crear un span e identificarlo con una clase según el icono que deseamos utilizar.

iconos solo con css

Todos los iconos son a un solo color, esto es una ventaja si lo vemos desde el punto de vista que simplemente debemos cambiar un código de color para implementarlo en nuestro sitio.

Ejemplo de uso:

Incluimos la hoja de estilo en nuestro proyecto, también podemos incluirla directamente en el archivo base de nuestro sitio, evitando así una llamada adicional.

<link rel="stylesheet" href="cikonss.css" />

Luego creamos un elemento al que le queremos aplicar el diseño del icono, por ejemplo:

<span class="icon icon-mid"><span class="icon-mail"></span></span>

Un span define la forma y el tamaño y el otro el icono a utilizar.

La compatibilidad es excelente, funciona en todos los navegadores, incluido Internet Explorer 8. Y la única condición es que soporten CSS2.

Web: Cikonss

Categorizado en: