Convertidor de Formato de Imagen - Convertir PNG, JPG, WebP y AVIF en Línea
Convierte imágenes entre formatos PNG, JPG, WebP y AVIF directamente en tu navegador. Conversión por lotes, control de calidad y comparación de tamaños — sin subir archivos.
Preguntas Frecuentes
Que es un convertidor de formato de imagen y por que lo necesito?
Un convertidor de formato de imagen cambia imagenes de un formato de archivo a otro (por ejemplo, PNG a WebP, JPG a AVIF). Esto es esencial para el desarrollo web porque los formatos modernos como WebP y AVIF ofrecen tamanos de archivo significativamente mas pequenos que los tradicionales PNG y JPEG, lo que resulta en tiempos de carga mas rapidos, menores costos de ancho de banda y mejores puntuaciones de Core Web Vitals. Una imagen PNG tipica de 2MB puede convertirse a WebP con menos de 500KB con una perdida visual minima de calidad.
Como uso este convertidor de formato de imagen?
1. Arrastra y suelta tus imagenes en el area de carga (o haz clic para explorar archivos). 2. Selecciona el formato de salida deseado (PNG, JPG, WebP o AVIF). 3. Ajusta el control deslizante de calidad para formatos con perdida (el valor predeterminado es 80%). 4. Haz clic en 'Convertir' para imagenes individuales o 'Convertir Todo' para procesamiento por lotes. 5. Revisa la comparacion de tamano de archivo antes/despues. 6. Descarga imagenes individuales o usa 'Descargar Todo' para un archivo ZIP.
Estan seguros mis datos de imagen? Se suben las imagenes a un servidor?
Tus imagenes estan 100% seguras y nunca salen de tu navegador. Toda la conversion de formato se realiza del lado del cliente utilizando la API Canvas de HTML5. Ningun dato de imagen se transmite a ningun servidor, lo que hace que esta herramienta sea completamente privada. Incluso puedes usarla sin conexion despues de que la pagina se cargue.
Cual es la diferencia entre PNG, JPG, WebP y AVIF?
PNG es un formato sin perdida con soporte de transparencia, ideal para graficos e iconos pero con tamanos de archivo mas grandes. JPG/JPEG es un formato con perdida sin transparencia, ideal para fotografias con buena compresion. WebP es un formato moderno que soporta compresion con y sin perdida con transparencia, tipicamente 25-35% mas pequeno que JPEG con mas del 95% de soporte en navegadores. AVIF es el formato mas nuevo con la mejor relacion de compresion (20-50% mas pequeno que WebP), con soporte de transparencia, aunque el soporte en navegadores aun esta creciendo.
Por que mi archivo convertido es mas grande que el original?
Esto puede suceder al convertir de un formato altamente comprimido a uno menos eficiente (por ejemplo, WebP a PNG) o cuando el original ya estaba bien optimizado. La salida PNG de la API Canvas siempre es sin perdida y puede ser mas grande que las alternativas con perdida. Intenta usar WebP o AVIF con una configuracion de calidad del 80% para la mejor relacion tamano-calidad.
Esta herramienta soporta AVIF en todos los navegadores?
La codificacion AVIF a traves de la API Canvas actualmente es compatible con Chrome 96+ y Edge 96+. Firefox y Safari tienen soporte limitado de codificacion AVIF. La herramienta detecta automaticamente las capacidades de tu navegador y deshabilitara la opcion AVIF si no es compatible, mostrando un mensaje claro.
Que sucede con la transparencia cuando convierto a JPG?
JPEG no soporta transparencia. Al convertir una imagen PNG o WebP transparente a JPG, las areas transparentes se rellenaran con un color de fondo (blanco por defecto). La herramienta te permite elegir un color de fondo personalizado usando el selector de color que aparece cuando se selecciona JPG como formato de salida.
Puedo convertir multiples imagenes a la vez?
Si, la conversion por lotes soporta hasta 20 imagenes simultaneamente. Todas las imagenes se convertiran al mismo formato de destino con la misma configuracion de calidad. Despues de la conversion, usa 'Descargar Todo (ZIP)' para descargar todas las imagenes convertidas en un solo archivo ZIP.
Ejemplos de Codigo
// Client-side image format conversion using Canvas API
async function convertImageFormat(file, outputFormat, quality = 0.8) {
return new Promise((resolve, reject) => {
const img = new Image();
const url = URL.createObjectURL(file);
img.onload = () => {
URL.revokeObjectURL(url);
const canvas = document.createElement('canvas');
canvas.width = img.width;
canvas.height = img.height;
const ctx = canvas.getContext('2d');
// Fill background for JPEG (no transparency support)
if (outputFormat === 'image/jpeg') {
ctx.fillStyle = '#ffffff';
ctx.fillRect(0, 0, canvas.width, canvas.height);
}
ctx.drawImage(img, 0, 0);
canvas.toBlob(
(blob) => {
if (!blob) {
reject(new Error('Conversion failed'));
return;
}
resolve({
blob,
originalSize: file.size,
convertedSize: blob.size,
inputFormat: file.type,
outputFormat: outputFormat,
sizeDiff: Math.round(((blob.size - file.size) / file.size) * 100),
});
},
outputFormat,
outputFormat === 'image/png' ? undefined : quality
);
};
img.onerror = () => {
URL.revokeObjectURL(url);
reject(new Error('Failed to load image'));
};
img.src = url;
});
}
// Check AVIF support
async function checkAvifSupport() {
const canvas = document.createElement('canvas');
canvas.width = 1;
canvas.height = 1;
return new Promise((resolve) => {
canvas.toBlob(
(blob) => resolve(blob?.type === 'image/avif'),
'image/avif',
0.5
);
});
}
// Batch conversion
async function convertBatch(files, outputFormat, quality = 0.8) {
const results = [];
for (const file of files) {
try {
const result = await convertImageFormat(file, outputFormat, quality);
results.push({ filename: file.name, ...result });
} catch (error) {
results.push({ filename: file.name, error: error.message });
}
}
return results;
}
// Usage
const input = document.querySelector('input[type="file"]');
input.addEventListener('change', async (e) => {
const files = Array.from(e.target.files);
const results = await convertBatch(files, 'image/webp', 0.8);
results.forEach((result) => {
if (result.error) {
console.error(`${result.filename}: ${result.error}`);
} else {
console.log(
`${result.filename}: ${result.inputFormat} -> ${result.outputFormat}, ` +
`${result.originalSize} -> ${result.convertedSize} (${result.sizeDiff}%)`
);
}
});
});