EjemploRedimensiona una imagen de muestra
Descarga este PNG de 800 × 600 y selecciónalo en la herramienta. Pon el ancho en 400 px con la proporción bloqueada para obtener 400 × 300. Pulsa Redimensionar Imagen para generar la copia y repítelo si cambias las dimensiones. La vista previa sigue mostrando el origen.
Descargar PNG de muestra (800 × 600)
Redimensionador de Imagen — Dimensiones Exactas con Canvas
Redimensiona una imagen compatible con el navegador a dimensiones exactas en píxeles o por porcentaje. La herramienta carga el archivo localmente, lo dibuja en un canvas HTML nuevo con el tamaño objetivo y crea una copia descargable en JPG o PNG. El bloqueo de proporción conserva las proporciones y los presets por porcentaje agilizan las reducciones habituales. El navegador elige su propio suavizado Canvas; si necesitas ampliación Lanczos3 explícita, usa la herramienta separada Image Upscaler. Los archivos se procesan en tu navegador y no se suben.
Cómo redimensionar una imagen
- Arrastra una imagen a la herramienta o pulsa para elegir un archivo local. El navegador debe poder mostrarla; los formatos compatibles varían según el navegador.
- Introduce el ancho y/o alto objetivo en píxeles, o elige una escala por porcentaje (25% / 50% / 75% son objetivos comunes de reducción).
- Mantén el bloqueo de proporción activo para conservar las proporciones — la dimensión complementaria se calcula sola para que el sujeto no se estire ni se aplaste.
- Pulsa Redimensionar Imagen para crear la copia. Si cambias las dimensiones, vuelve a pulsarlo para actualizar el resultado. La vista previa sigue mostrando la imagen original.
- Descarga la copia reescalada. El original queda intacto en el disco; nada se sube.
Casos de uso comunes
- Bajar fotos de cámara a dimensiones amigables para web antes de subirlas a un blog o CMS con presupuesto de peso por imagen.
- Casar una foto de producto con las dimensiones exactas de un slot de CMS para evitar el recorte centrado o el letterbox de la plataforma.
- Producir copias más pequeñas de un máster grande para uso de miniatura o vista previa al pasar el cursor sin reexportar desde un editor de escritorio.
- Asegurar que las fotos para redes aterrizan en las dimensiones esperadas sin estirar ni recortar (usa la herramienta hermana social-media-resizer para presets de plataforma con un clic).
- Generar variantes responsive (entradas srcset 1× / 2× / 3×) desde un único origen ejecutando escalas por porcentaje consecutivas.
Preguntas frecuentes
¿Debo mantener la proporción bloqueada?
Casi siempre sí. Estirar a una proporción distinta distorsiona el sujeto — el sistema visual humano registra cualquier escalado no uniforme de caras o cuerpos como 'mal'. Si necesitas otra proporción, recorta primero con la herramienta aspect-ratio-crop para recomponer y luego redimensiona. El bloqueo viene activo por defecto por esa razón.
¿Qué algoritmo de remuestreo usa la herramienta?
Esta página usa la canalización Canvas drawImage() del navegador. El algoritmo exacto de suavizado depende de la implementación y aquí no se anuncia como Lanczos. Para una ampliación Lanczos3 explícita, usa la herramienta separada Image Upscaler.
¿Puedo ampliar aquí?
Puedes ampliar una imagen aquí, pero la interpolación del navegador no puede inventar detalle. Para una ruta específica de ampliación Lanczos3, usa Image Upscaler.
¿Reescalar pierde calidad?
Cualquier cambio de tamaño modifica la cuadrícula de píxeles. Reducir descarta el detalle que no cabe en la resolución menor y ampliar interpola los píxeles existentes. Una entrada PNG produce PNG; las demás entradas compatibles producen una copia JPG con la calidad actual de la herramienta.
¿Y los orígenes HDR o de gama amplia?
La vía Canvas 2D opera en sRGB a precisión de 8 bits según IEC 61966-2-1:1999. Los orígenes HDR (Display P3 de gama amplia, BT.2020 con transferencia PQ o HLG) se mapean tonalmente a SDR sRGB durante el paso drawImage, perdiendo gama amplia y alto rango dinámico en la salida reescalada. Para flujos con HDR redimensiona en un editor de escritorio que preserve el perfil de color (Photoshop, Affinity Photo, GIMP 3.0+) y exporta al final.
Cómo funciona el redimensionado en navegador — y por qué importa la proporción
La herramienta decodifica la imagen seleccionada, la dibuja en un canvas nuevo con el ancho y alto solicitados y serializa el resultado con toBlob(). Bloquear la proporción evita estiramientos accidentales. Reducir elimina el detalle que no cabe en la resolución menor; ampliar interpola los píxeles existentes y no puede crear detalle nuevo. El navegador elige la implementación exacta del suavizado. El formato de salida sigue el comportamiento actual: una entrada PNG produce PNG, mientras que las demás entradas compatibles producen una copia JPG. Los archivos permanecen en el navegador.
- Redimensiona por píxeles exactos o escala por porcentaje
- Bloqueo de proporción para preservar las proporciones del sujeto
- Presets rápidos de porcentaje (25% / 50% / 75%) para flujos de reducción comunes
- Redimensionado mediante Canvas del navegador con salida JPG/PNG local
- El formato sigue el comportamiento actual: una entrada PNG produce PNG; las demás entradas compatibles producen JPG
- Bloqueo de proporción para evitar estiramientos accidentales
- Archivos procesados localmente en el navegador — sin subida
Gratis. Sin registro. Sin subidas. Anuncios mediante AdSense (con consentimiento).
Fuentes (4)
- WHATWG (live). HTML Living Standard — Canvas 2D Context: drawImage() + imageSmoothingQuality. html.spec.whatwg.org/#dom-context-2d-drawimage — browser resampling mechanism: drawImage(source, dx, dy, dw, dh) scales the source bitmap to the destination rectangle; imageSmoothingQuality property accepts 'low' (default) / 'medium' / 'high' and requires imageSmoothingEnabled = true.
- Mozilla Developer Network (MDN) (live). CanvasRenderingContext2D.imageSmoothingQuality. developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/imageSmoothingQuality — documents the browser-controlled smoothing hint; the exact algorithm remains implementation-defined.
- ITU-T (CCITT) Study Group VIII & ISO/IEC JTC 1/SC 29/WG 10 (JPEG) (1992). Information technology — Digital compression and coding of continuous-tone still images: Requirements and guidelines. ITU-T Recommendation T.81 (18 September 1992) / ISO/IEC 10918-1:1994 — JPEG baseline DCT bitstream; Annex K quantisation tables apply when the resized result is re-encoded as JPG.
- International Electrotechnical Commission (IEC) (1999). Multimedia systems and equipment — Colour measurement and management — Part 2-1: Default RGB colour space — sRGB. IEC 61966-2-1:1999 — default 8-bit RGB colour space the Canvas 2D path operates in; resampling occurs in the canvas pixel buffer's sRGB encoding regardless of the source image's colour profile.
Son las especificaciones del W3C, ISO/IEC, ITU-T e IETF que la herramienta implementa o sobre las que se apoya. Localízalas en w3.org, iso.org, itu.int o datatracker.ietf.org.
Guías relacionadas
- Imágenes y Core Web Vitals: diagnostica antes de comprimirIdentifica el elemento LCP, reserva espacio y comprueba los cambios sin confundir bytes ahorrados con velocidad medida.
- Quitar un fondo: revisa la máscara y la exportaciónComprueba bordes, transparencia y formato sin dar por exacta una máscara automática.
- Imágenes responsivas con srcset — Explicado correctamentesrcset y sizes sin el lío. Cómo elige el navegador, qué hacen los descriptores w y x y los patrones que funcionan en producción.