Librería de recursos · Fase 01

Recursos que se copian, se pegan y enamoran.

Bienvenido a la librería de XandA. En su primera entrega: una colección de íconos con estilo propio, listos para buscar, probar y llevarse a cualquier proyecto con una sola clase.

Explorar íconos Cómo se usan
0
íconos listos
0
categorías
1
clase por ícono
0
dependencias
vista previa 01 / 10

—

Toca el ícono o la clase para copiarla

Explorador de íconos

Encuentra el ícono perfecto

Busca por nombre, filtra por categoría y ajusta el tamaño de vista previa. Un clic en cualquier ícono abre su ficha con el código listo para copiar.

/

Guía de uso

Tres pasos y listo

Sin paquetes ni instalaciones: una hoja de estilos, una clase y control total desde tu propio CSS.

  1. 01

    Conecta la colección

    Una sola hoja de estilos trae todos los íconos a tu sitio. Pégala dentro del <head> de tu página y no vuelve a molestar.

    pagina.html 
    <!-- Una sola vez, en el head -->
<link rel="stylesheet" href="https://xandalibreria.github.io/src/assets/styles/xa-iconos.css">
  2. 02

    Invoca el ícono

    Cada ícono vive en una etiqueta con su propia clase. Escríbela donde quieras verlo: hereda el color del texto y fluye con tu contenido.

    pagina.html 
    <i class="xa-computadora"></i>
  3. 03

    Hazlo tuyo

    Tamaño, color, margen… todo se controla desde tu CSS como cualquier otro texto. Sin trucos ni variables raras.

    estilos.css 
    .xa-computadora {
  font-size: 32px;   /* tamaño */
  color: #8B7CF7;  /* color  */
}

Hoja de ruta

Lo que viene en las próximas fases

La librería crecerá por entregas. Esto es lo que estamos preparando mientras los íconos se quedan cuidando el lugar.

  • /02

    Plantillas

    Secciones y páginas completas listas para copiar, pegar y personalizar.

    Fase 2 · en camino
  • /03

    Efectos y animaciones

    Transiciones, entradas y micro-interacciones que se activan con una línea.

    Fase 2 · en camino
  • /04

    Componentes

    Botones, tarjetas, formularios y navegación coherentes con tu marca.

    Fase 3 · en camino
  • /05

    Tipografía y color

    Escalas tipográficas y paletas armadas para combinar con los recursos.

    Fase 3 · en camino

¿Falta un ícono que necesitas?

Cuéntanos qué recurso te haría la vida más fácil y podría llegar en la próxima entrega de la librería.

Seguir explorando