Juegos / Imágenes
Creador, cortador y animador de hojas de sprites
Organiza imágenes en una hoja de sprites o un atlas de texturas, divide una hoja en fotogramas independientes y anímalos. Guarda PNG, metadatos hash en JSON, clases CSS, archivos ZIP o un GIF animado sin subir tus imágenes.
Creador, cortador y animador de hojas de sprites: Crear combina imágenes PNG, JPG y WebP, además de fotogramas GIF decodificados, en una hoja con disposición en cuadrícula, por filas, por columnas o compactada. Las celdas uniformes se ajustan a la imagen más grande, con alineación centrada o centrada en la parte inferior, relleno, separación y dimensiones opcionales de potencia de dos. Cortar divide por cantidad de celdas o tamaños en píxeles, o detecta islas separadas por transparencia o por una clave de color de fondo. Puedes excluir rectángulos, omitir celdas vacías y recortar los bordes transparentes antes de guardar un ZIP o enviar los fotogramas a Animar. Animar reproduce un intervalo seleccionado de fotogramas a 1–60 FPS, en orden normal o ping-pong, con zoom de píxeles y piel de cebolla opcional. Guarda un GIF o una tira PNG horizontal. Empieza con el creador de pixel art si necesitas dibujar primero los fotogramas. Funciona al 100 % en tu navegador, sin subir archivos a ningún servidor.
- Categoría
- Juegos y fiestas
- Se ejecuta
- En tu navegador
- Coste
- Gratis · sin registro
- Disponibilidad
- Lista para usar
Funciona por completo en tu navegador
Organiza los fotogramas en una hoja para tu juego.
Las celdas uniformes usan el fotograma más grande, además de relleno en todos los lados. El espaciado separa las celdas.
Añade fotogramas para comenzar. También puedes cortar una hoja en Cortar y enviar aquí sus fotogramas.
Tus imágenes y exportaciones permanecen en este navegador. Usa los archivos guardados en tu propio proyecto de juego.
Hojas de sprites y atlas de texturas
Una hoja de sprites almacena varios fotogramas de animación o imágenes de un juego en una sola imagen. Una cuadrícula regular describe cada fotograma mediante la posición de su celda. Un atlas de texturas puede usar rectángulos desiguales y necesita coordenadas que describan cada imagen. La documentación de AtlasTexture de Godot (https://docs.godotengine.org/en/stable/classes/class_atlastexture.html) explica cómo se utiliza una región de un atlas como textura.
La alineación centrada en la parte inferior mantiene los pies de un personaje en la misma línea base en todos los fotogramas. Las estanterías empaquetadas conservan las dimensiones originales de cada imagen y evitan la rotación. El tamaño potencia de dos añade píxeles no utilizados a la derecha o en la parte inferior; no escala tu ilustración. PNG conserva la transparencia alfa completa, mientras que GIF tiene menos colores y solo transparencia de un bit.
Coordenadas hash de JSON
La exportación de hash JSON utiliza los nombres de los fotogramas como claves dentro de frames. Cada entrada tiene un rectángulo de fotograma con x, y, w y h, un sourceSize, un spriteSourceSize y las marcas rotated y trimmed. Las coordenadas cuentan los píxeles desde la esquina superior izquierda de la hoja. El objeto meta registra el nombre de archivo de la imagen y el tamaño total de la hoja. El cargador de atlas hash JSON de Phaser (https://docs.phaser.io/api-documentation/class/loader-loaderplugin#atlasJSONHash) describe este formato de fotogramas con nombre.
Haz que las exportaciones usen los límites de la imagen original en lugar de los límites de la celda con relleno, con trimmed y rotated establecidos en false. Cut puede exportar una lista independiente de rectángulos seleccionados. Recorta los bordes transparentes solo cuando quieras recortes ajustados; déjalo desactivado para conservar las celdas regulares de animación y su punto de registro. Compara los rectángulos guardados con el importador de tu motor antes de usar el atlas en un proyecto.
Cómo se usa
- Elige Crear, Cortar o Animar; cada modo tiene un enlace que puedes guardar como marcador.
- Añade fotogramas o una hoja y ajusta la disposición, la cuadrícula de corte o la configuración de la animación.
- Previsualiza el resultado y descarga los archivos para tu proyecto de juego.
Privacidad y límites
Tus archivos permanecen en tu navegador. No se sube nada.
Herramientas relacionadas
Preguntas frecuentes
¿Debo usar una cuadrícula o un atlas de texturas compactado?
Una cuadrícula asigna a cada fotograma el mismo tamaño de celda y facilita cortarlo o importarlo como una animación regular. Una hoja compactada coloca fotogramas de distintos tamaños en filas para ahorrar espacio. Los fotogramas compactados no se giran y necesitan los rectángulos JSON exportados o una configuración equivalente de regiones en tu motor de juego.
¿Por qué usar relleno, separación o extrusión de bordes?
Las texturas filtradas pueden muestrear píxeles vecinos y crear juntas de color, un efecto llamado bleeding de texturas. El relleno deja espacio dentro de cada celda; la separación deja un hueco entre celdas. Esta herramienta añade píxeles transparentes o del color de fondo, no píxeles copiados de los bordes. La extrusión repite los colores del borde de un sprite en su contorno; usa la configuración de texturas de tu motor o un empaquetador de atlas con extrusión si tu proyecto lo necesita, especialmente con mipmaps.
¿Cómo importo la hoja en Godot, Unity o Phaser?
En Godot, usa regiones de la hoja como texturas de atlas o fotogramas de animación. En Unity, trata la imagen como varios sprites y corta una cuadrícula regular o define los rectángulos. Phaser puede usar una hoja de sprites regular o un atlas hash JSON. Mantén juntos el PNG y su JSON. La configuración de importación varía: elige el filtrado de vecino más cercano para pixel art nítido, comprueba la transparencia y las dimensiones de las celdas, y asegúrate de que los nombres de los fotogramas y el formato JSON sean adecuados para tu proyecto.
¿Cuáles son los límites de transparencia y temporización de GIF?
GIF admite como máximo 256 colores de paleta y una entrada de paleta transparente, por lo que los píxeles son totalmente transparentes u opacos. El alpha inferior al 50% se vuelve transparente; el resto se vuelve opaco. Elige un color mate para combinar los bordes suaves. Los retardos de los fotogramas se redondean a 10 ms, con un mínimo de 20 ms, por lo que 60 FPS no se puede representar exactamente. El GIF exportado se repite de forma continua; ping-pong añade los fotogramas de vuelta sin repetir los extremos.
¿Mis archivos salen del navegador?
No. La lectura de imágenes, la organización de hojas, la detección de islas y la creación de exportaciones se realizan en tu dispositivo. Las hojas grandes y las animaciones largas necesitan más memoria. Aparece un aviso por encima de 400 fotogramas o 8.192 píxeles por lado. Los límites de trabajo son 1.000 fotogramas importados, 16.384 píxeles por lado y 64 millones de píxeles por imagen o exportación de animación.
Herramienta gratuita · se ejecuta en tu navegador · sin cuenta