Generador de sprites CSS
Ordena las imágenes y revisa la vista previa. El CSS generado asigna a cada imagen su tamaño y posición de fondo dentro del sprite.
Se ejecuta localmente en tu navegador · PNG · CSS · ZIP
Ordena las imágenes y revisa la vista previa. El CSS generado asigna a cada imagen su tamaño y posición de fondo dentro del sprite.
Se ejecuta localmente en tu navegadorGenerador de sprites CSS forma parte de las herramientas de imagen de KivTools. El taller de arriba resuelve todo el trabajo en una sola pantalla: archivos elegidos en tu dispositivo y después una imagen generada.
La conversión se ejecuta dentro de la página con JavaScript. Nada de lo que escribes se sube, la herramienta sigue funcionando sin conexión y sirve para datos que no puedes enviar a un tercero.
Los formatos binarios llevan más que el contenido visible: metadatos, perfiles de color, fuentes incrustadas y, en la práctica, bastante información que no pensabas publicar. Estas herramientas transforman o inspeccionan el archivo manteniendo intacto el contenido útil.
Dos trampas dominan: la calidad perdida por recompresiones sucesivas y los metadatos que quedan tras una edición. Comprime una sola vez desde el original y revisa qué sigue declarando el archivo antes de compartirlo.
Navegadores, herramientas de escritorio y utilidades de línea de comandos deberían coincidir; una diferencia suele indicar otra codificación, otra configuración regional u otra versión. Abre el resultado en un visor de confianza y comprueba tamaño, dimensiones y, si importa, el panel de metadatos, no el nombre del archivo.
Algunos formatos son contenedores: la extensión no dice qué hay dentro. Cuando un sistema rechaza un archivo, mira los primeros bytes antes de renombrarlo. Guarda una copia de la entrada mientras pruebas, para que un ajuste equivocado no destruya el original.
Acepta hasta 50 imágenes, distribución, columnas, espacio y prefijo de clase; genera vista PNG, código CSS y ZIP con ambos archivos.
Unir iconos de interfaz en una petición, crear sprites de recursos estáticos y generar coordenadas CSS sin medición manual.
Cada imagen se decodifica y dibuja en Canvas localmente; PNG, CSS y ZIP permanecen en el navegador hasta su descarga.
Las imágenes conservan su tamaño dentro de celdas iguales; dimensiones muy grandes pueden superar el límite de Canvas y las animaciones usan un fotograma.
Sí. Todas las herramientas de KivTools son gratuitas, no piden cuenta ni tienen cuota. No hay plan de pago escondido detrás del taller ni hace falta un correo para usar el resultado.
En tu navegador. El script se carga una vez y la conversión ocurre en tu equipo; por eso la herramienta sigue funcionando cuando se cae la red.
Acepta hasta 50 imágenes, distribución, columnas, espacio y prefijo de clase; genera vista PNG, código CSS y ZIP con ambos archivos. Las entradas grandes suelen ir bien; para volúmenes extremos es mejor una herramienta local de línea de comandos.
Las dimensiones pesan más en el tamaño del archivo que el control de calidad. Compara primero una muestra pequeña y conocida si el resultado alimenta un proceso automático.
El resultado es tuyo: sin marca de agua, sin etiqueta de licencia y sin atribución obligatoria. Solo revisa la licencia del formato de base si va dentro de un producto.
La página funciona en cualquier navegador móvil moderno y pasa a una sola columna en pantallas pequeñas. Las herramientas locales siguen funcionando sin conexión una vez cargada la página.