Saltar al contenido principal

Generador de Sprites CSS

Combina varios iconos pequeños en una sola hoja de sprites y obtén el CSS de posición correspondiente.

Cómo Usarlo

  1. 1Selecciona al menos dos imágenes y revisa su orden.
  2. 2Elige disposición, espacio, relleno, fondo y formato de salida.
  3. 3Edita la clase CSS base y los nombres individuales; reordena o elimina recursos.
  4. 4Genera el sprite, revisa la vista PNG/WebP y copia el CSS o HTML.
  5. 5Descarga el paquete con la imagen, la hoja de estilos y el marcado de ejemplo.

Sobre esta herramienta

Crea una hoja CSS sprite en el navegador con espaciado, fondo, clases seguras y fragmentos CSS/HTML listos para usar.

Preguntas Frecuentes