Escalador de pixel art
Amplía sprites, iconos y pixel art sin desenfoque. Elige bloques exactos de vecino más cercano, reglas de bordes nítidas de Scale2x/Scale3x o curvas suaves de xBR, compara los métodos lado a lado y descarga un PNG transparente o un ZIP para todo un lote.
Última actualización:
Comparar métodos
El mismo sprite a 4×. Haz clic en uno para usarlo.
Cómo usar Escalador de pixel art
- Añade sprites: arrastra, pega o elige uno o más archivos PNG, GIF, WebP o BMP. Se carga como ejemplo un sprite de seta de 16 × 16.
- Elige un algoritmo: Vecino más cercano para píxeles exactos, Scale2x/Scale3x para un suavizado nítido o xBR para curvas más redondeadas. La fila Comparar métodos muestra los tres.
- Elige el factor de escala; el tamaño de salida y el número de colores aparecen encima del resultado.
- Revisa los bordes sobre distintos fondos para asegurarte de que la transparencia se ve bien.
- Descarga el PNG, copia la imagen o pulsa Descargar todo (ZIP) si añadiste varios archivos.
Cómo funcionan los algoritmos
Todo escalador de pixel art mira un píxel E y sus vecinos, y luego decide cómo debe ser cada uno de los nuevos subpíxeles:
| Vecindario | |||
|---|---|---|---|
| A | B | C | |
| D | E | F | |
| G | H | I | |
- Vecino más cercano copia E en los N × N píxeles de salida. No se inventa nada, así que es la opción correcta cuando el arte debe quedar exactamente como se dibujó, por ejemplo en motores de juego que renderizan con escalado entero.
- Scale2x (EPX) divide E en cuatro. El de arriba a la izquierda pasa a ser D si D = B, B ≠ F y D ≠ H; las otras tres esquinas siguen la misma regla girada. Los escalones diagonales se convierten en líneas suaves de 45° y solo se usan colores existentes. Scale3x aplica la misma idea a un bloque de 3 × 3.
- xBR (de Hyllian) mide las diferencias de color en un espacio YUV ponderado en un vecindario de 5 × 5 (sin las esquinas) para decidir si un borde pasa por cada esquina de E y qué tan inclinado es. Luego mezcla un 25%, 50% o 75% del color del borde en los subpíxeles afectados, lo que da curvas suaves con antialiasing.
Qué método para cada tipo de arte
| Estilo de arte | Mejor método | Por qué |
|---|---|---|
| Recursos para un motor de juego, estilo retro | Vecino más cercano | Píxeles exactos, sin colores nuevos, totalmente predecible |
| Iconos y sprites con contornos diagonales | Scale2x / Scale3x | Suaviza los escalones de 45° pero sigue nítido y conserva la paleta |
| Personajes con formas redondas, logotipos, fan art | xBR | Convierte las curvas dentadas en líneas suaves |
| Arte de paleta limitada para imprimir en merchandising | xBR con Mezclar bordes desactivado | Formas suaves solo con los colores originales |
| Arte con tramado y patrones de cuadros | Vecino más cercano | Las reglas de bordes pueden confundir el tramado con bordes |
Consejos
- Empieza desde el tamaño original. Si tu sprite ya estaba ampliado (cada píxel es un bloque de 4 × 4), redúcelo primero con vecino más cercano y luego amplíalo; los algoritmos de bordes solo funcionan con pixel art real 1:1.
- Usa PNG. La compresión JPG añade ruido entre píxeles, que los escaladores con detección de bordes interpretan como detalle. Exporta los sprites como PNG o GIF.
- Revisa sobre varios fondos para asegurarte de que no quedan píxeles semitransparentes sueltos alrededor de los bordes.
Preguntas frecuentes
¿Por qué el pixel art se ve borroso cuando lo redimensiono?
La mayoría de los editores de imágenes y navegadores redimensionan con interpolación bilineal o bicúbica, que promedia los píxeles vecinos y crea colores intermedios suaves y borrosos. El pixel art necesita un escalado de vecino más cercano, que simplemente repite cada píxel como un bloque cuadrado, o un algoritmo específico de pixel art que entienda los bordes.
¿Qué diferencia hay entre vecino más cercano, Scale2x y xBR?
El vecino más cercano convierte cada píxel en un bloque de N × N y mantiene el arte exactamente como se dibujó. Scale2x (también llamado EPX o AdvMAME2x) mira los cuatro vecinos de cada píxel y rellena las esquinas a lo largo de los bordes diagonales, lo que elimina los escalones sin añadir colores. xBR compara un vecindario más amplio mediante distancias de color y mezcla en la dirección del borde detectado, lo que da curvas suaves y diagonales con antialiasing.
¿Qué factor de escala debo usar?
Usa factores enteros para que cada píxel original corresponda al mismo número de píxeles de salida. Para un juego o un sitio web, elige el factor que coincida con el tamaño de visualización, por ejemplo 4× para convertir un sprite de 32 × 32 en 128 × 128. Scale2x y xBR funcionan en pasos de 2× (Scale3x en 3×), así que 4× y 8× se obtienen aplicándolos varias veces.
¿El escalador conserva la transparencia?
Sí. Los píxeles transparentes siguen siéndolo y el PNG de salida conserva su canal alfa. El vecino más cercano y Scale2x/3x solo copian píxeles existentes. xBR mezcla a lo largo de los bordes y, con Mezclar bordes activado, combina los colores con alfa premultiplicado, para que los bordes junto a zonas transparentes no tengan halos oscuros. Desactiva Mezclar bordes para obtener bordes duros sin colores nuevos.
¿xBR es lo mismo que hqx?
No, aunque están relacionados. Ambos son escaladores de pixel art con detección de bordes creados para emuladores. hqx usa una gran tabla de consulta de patrones de vecinos, mientras que xBR usa reglas de distancia de color para encontrar los bordes, y suele ser un poco más suave en las curvas. Esta herramienta implementa xBR, Scale2x/Scale3x y vecino más cercano.
¿Puedo ampliar fotos con esta herramienta?
Esta herramienta está pensada para sprites y pixel art, de hasta 1,024 píxeles por lado. Para fotos y capturas de pantalla, usa el Ampliador de imágenes, que usa remuestreo Lanczos o bicúbico y un enfoque adecuados para imágenes de tono continuo.
¿Se prueban todas las herramientas de FreeToolCabin para comprobar su calidad y precisión?
Sí. Cada herramienta del sitio pasa pruebas automáticas en navegadores reales para comprobar que el resultado es correcto y que no hay errores. Si encuentras un fallo o tienes una sugerencia, escríbenos a [email protected] y lo revisaremos.