Recorta tu imagen online

Recorta JPG, PNG, WebP o AVIF a cualquier proporción: 1:1, 16:9, 9:16, 4:5, 3:2, 4:3 o píxeles a medida.

o suelta la imagen aquí

Acerca de esta herramienta

Recorta cualquier imagen a un área rectangular en tu navegador con la herramienta de recorte de Araluma, basada en cropperjs v2. Arrastra un archivo JPG, PNG, WebP o AVIF a la página y el lienzo de recorte se abre al instante. Mueve los tiradores para colocar la selección, bloquea una proporción (1:1, 16:9, 9:16, 4:5, 3:2, 4:3 o A4), o escribe las dimensiones exactas en píxeles y el marco se ajusta. La lectura en vivo te muestra el tamaño de salida en píxeles reales de la imagen original antes de pulsar descargar. Tu imagen permanece en tu dispositivo durante todo el proceso: la pestaña Red en DevTools no registra ninguna petición saliente de imagen mientras recortas. La salida en PNG y WebP preserva la transparencia del archivo original, la salida en JPG sustituye las áreas transparentes con un fondo blanco. Los metadatos EXIF se eliminan en cada exportación. Esta herramienta sirve a cualquiera que necesite un recorte rectangular rápido y preciso sin instalar nada, un archivo a la vez.

Recortar imagen
Cómo funciona la herramienta de recorte en tu navegador

Cómo funciona la herramienta de recorte en tu navegador

Tu imagen la abre directamente el navegador mediante la API de archivos. No se sube nada a un servidor ni se guarda ninguna copia temporal fuera de tu dispositivo. Arrastra el marco de recorte a la posición que necesites, ajusta el tamaño desde las esquinas o los bordes, y la lectura en vivo de píxeles se actualiza mientras arrastras. Las coordenadas están en el espacio de píxeles de la imagen original, así que el número que ves es el tamaño literal del archivo de salida. Abre DevTools y cambia a la pestaña Red mientras recortas: no aparece ninguna petición saliente de imagen. El archivo que arrastras y el que descargas permanecen completamente en tu dispositivo durante toda la sesión.

Recortar imagen
Bloquea una proporción o escribe píxeles exactos

Bloquea una proporción o escribe píxeles exactos

Toca un chip de proporción (1:1 para cuadrado, 16:9 para panorámica, 9:16 para retrato, 4:5, 3:2, 4:3 o A4) y el marco de selección se bloquea a esa proporción. Arrástralo por la imagen para elegir qué parte conservar. Para llegar a un tamaño en píxeles concreto, escribe el ancho y el alto en los campos de dimensión y el marco se redimensiona para coincidir. La selección mínima es el límite intrínseco del elemento de selección de cropperjs v2. La salida siempre equivale al tamaño en píxeles de origen de la selección. La herramienta no amplía: si tu selección mide 600 px de ancho, el archivo de salida mide 600 px de ancho.

Recortar imagen
La salida JPG sustituye la transparencia por blanco

La salida JPG sustituye la transparencia por blanco

Si tu archivo de origen tiene áreas transparentes (PNG, WebP con alfa, o AVIF con alfa) y eliges JPG como formato de salida, esos píxeles transparentes se rellenan con blanco. JPG no tiene canal alfa, así que no hay sitio donde quepa la transparencia. Para preservar la transparencia, elige PNG, WebP o AVIF en el selector de formato de la pantalla final. La salida PNG y WebP arrastra el canal alfa original sin cambios. AVIF también admite alfa. El selector de formato etiqueta cada opción para que la compensación sea visible antes de descargar.

Recortar imagen
Mueve la selección con precisión usando el teclado

Mueve la selección con precisión usando el teclado

Pulsa Tab para llegar al marco de recorte, luego usa las teclas de flecha para mover la selección un píxel a la vez. Mantén Mayús y el paso crece a diez píxeles. Esta navegación por teclado está integrada en cropperjs v2 como funcionalidad nativa, no es una capa de accesibilidad añadida. Resulta útil cuando necesitas una alineación visual subpíxel que un trackpad no consigue, o cuando trabajas con un equipo solo de teclado. La selección también responde al tacto en móvil: pellizca para hacer zoom en el lienzo y arrastra las esquinas de la selección para recomponer. Ningún modo extra que activar en ninguno de los dos casos.

Recortar imagen
Formatos de salida: PNG, JPG, WebP y AVIF

Formatos de salida: PNG, JPG, WebP y AVIF

Tras recortar, elige el formato de descarga en la pantalla final. PNG es sin pérdida y preserva la transparencia. JPG aplica compresión con pérdida a calidad 0,9 por defecto, visualmente indistinguible del origen en la mayoría de fotos. WebP combina modos sin pérdida y con pérdida, y también admite transparencia. AVIF se codifica mediante la biblioteca @jsquash/avif a calidad 0,9. Produce el archivo más pequeño con calidad visual equivalente, pero la primera codificación AVIF de la sesión supone una descarga única de 870 KB del módulo WASM. El formato de salida por defecto coincide con tu entrada: una entrada PNG se descarga como PNG por defecto, una entrada JPG se descarga como JPG. Puedes cambiarlo en cualquier momento en la pantalla final.

Recortar imagen
Cuándo usar otra herramienta de recorte

Cuándo usar otra herramienta de recorte

Esta herramienta recorta solo rectángulos: cuadrados, proporciones horizontales, proporciones verticales y dimensiones personalizadas en píxeles. Para un recorte circular, una foto de perfil con esquinas transparentes, usa Recorte en Círculo. Comparte el mismo procesamiento en el navegador pero entrega un PNG redondo. Para preajustes específicos de plataforma con las dimensiones por defecto ya configuradas (Instagram 1080x1080, miniatura de YouTube 1280x720, portada de Facebook 1200x630), las páginas de recorte por preajuste de la familia Crop se abren con esas dimensiones cargadas para que no tengas que calcular nada. Si tu imagen necesita cambiar de formato sin recortar primero, usa la herramienta Convertir para llegar a PNG, JPG, WebP o AVIF.

Cómo recortar una foto en círculo

  1. Suelta tu imagen

    Abre la herramienta y arrastra tu archivo JPG, PNG, WebP o AVIF al área de carga, o haz clic para buscarlo en tu dispositivo.

  2. Elige una proporción o un tamaño en píxeles

    Toca un chip de proporción (1:1, 16:9, 9:16, 4:5, 3:2, 4:3 o A4) o escribe las dimensiones exactas en píxeles en los campos de ancho y alto para definir el marco de recorte.

  3. Coloca el marco

    Arrastra el marco de recorte al área de la imagen que quieres conservar, luego ajusta el tamaño desde las esquinas o los bordes hasta que la lectura en vivo muestre el tamaño de salida que necesitas.

  4. Recorta y descarga

    Haz clic en Recortar, elige tu formato de salida (PNG, JPG, WebP o AVIF) en la pantalla final y descarga el archivo recortado en tu dispositivo.

Preguntas frecuentes

¿Cómo recortar una imagen?

Arrastra tu imagen a la herramienta de recorte, elige una proporción o escribe las dimensiones en píxeles, mueve el marco de selección sobre el área que quieres conservar, luego pulsa Recortar y descarga. Todo el proceso transcurre en tu navegador. Un recorte típico desde la subida hasta la descarga lleva menos de diez segundos en un dispositivo moderno.

¿Cómo puedo recortar imágenes PNG online?

Carga el PNG en la herramienta de recorte, fija la proporción o las dimensiones, coloca el marco de recorte y pulsa Recortar. En la pantalla final, elige PNG como formato de salida para mantener el canal alfa intacto. Si eliges JPG, las áreas transparentes se reemplazan con un fondo blanco. La salida PNG es sin pérdida, así que no se pierde calidad de píxel durante el recorte.

¿Cómo recorto fotos para Instagram sin una app?

Abre la herramienta de recorte en tu navegador, carga tu foto y toca el chip 1:1 para un post cuadrado de Instagram, o el chip 4:5 para un post vertical. Arrastra el marco para encuadrar tu sujeto, pulsa Recortar y descarga. La salida tiene el tamaño en píxeles de origen de la selección. Para una Historia o un Reel, usa la proporción 9:16.

¿Cuáles son las mejores proporciones para recortar imágenes para redes sociales?

Usa 1:1 para un post cuadrado de Instagram, 4:5 para un post vertical que ocupe más feed, 9:16 para una Historia o Reel, y 16:9 para una miniatura de YouTube o cabecera de Twitter. Las portadas de Facebook funcionan bien al tamaño 1200x630 píxeles, cercano a una proporción 2:1. La herramienta de recorte tiene chips para 1:1, 16:9, 9:16, 4:5, 3:2 y 4:3, además de entrada de píxeles a medida.

¿Puedo recortar una imagen en círculo con esta herramienta?

No, esta herramienta recorta solo rectángulos: cuadrado, horizontal, vertical y dimensiones personalizadas. Para un recorte circular con fondo transparente, usa la herramienta Recorte en Círculo. Utiliza el mismo procesamiento en el navegador, así que tu imagen permanece en tu dispositivo, pero entrega un PNG redondo con esquinas transparentes en lugar de un rectángulo.

¿Cómo recorto una imagen a un tamaño exacto en píxeles?

Escribe el ancho y el alto objetivo en los campos de dimensión del lienzo de recorte. El marco se redimensiona para coincidir y la lectura en vivo confirma el tamaño de salida en píxeles de origen. La salida siempre equivale a las dimensiones en píxeles de origen de la selección. La herramienta no amplía: si la selección es menor que tu objetivo, la salida también será menor.

Los detalles

Notas del equipo sobre el oficio, los formatos y las pequeñas decisiones detrás de un buen recorte redondo.

La biblioteca cropperjs v2 y lo que cambió respecto a v1
Esta herramienta se basa en cropperjs versión 2.1.1, una reescritura completa de la biblioteca cropperjs original. La versión v2 sustituye la antigua API basada en constructor (new Cropper(img, { aspectRatio: 1 })) por una arquitectura de Web Components. El lienzo de recorte, la superposición de selección y el elemento de imagen son todos elementos HTML personalizados registrados a través del CustomElementRegistry del navegador. Esto significa que el Shadow DOM gestiona todos los estilos internos: no hay un archivo cropper.css separado que importar, lo que elimina una petición de activo de Vite en comparación con v1. El bloqueo de proporción ahora se aplica al propio elemento de selección (cropperSelection.aspectRatio = 1) en lugar de al constructor, así que la proporción puede cambiar en tiempo de ejecución sin reinicializar toda la interfaz de recorte. La biblioteca pesa 41.960 bytes en bruto y 12.175 bytes en gzip, medidos directamente desde la cabecera content-length del CDN jsDelivr. Esos 12 KB se pagan una vez por sesión y se reutilizan en todas las rutas de recorte con preajuste mediante división de chunks de Vite.
Cómo se calculan las dimensiones de salida en píxeles (sin ampliación)
Cuando arrastras la selección de recorte en pantalla, las coordenadas que ves están en el espacio de píxeles de la imagen original, no en el espacio de píxeles CSS. Esta distinción importa en pantallas de alta densidad: un móvil con una proporción de píxeles de 3x muestra una imagen de 300 píxeles CSS de ancho como 900 píxeles reales, pero las coordenadas de la selección reflejan los 900 píxeles reales, no los 300 CSS. El archivo de salida que descargas contiene exactamente el número de píxeles que el rectángulo de selección representa en la imagen original. La operación de recorte llama a selection.$toCanvas() de la API de cropperjs v2, un método asíncrono que devuelve un nuevo HTMLCanvasElement dimensionado al tamaño en píxeles de la selección. Ese lienzo se pasa a canvas.toBlob() para PNG, JPG o WebP, o al codificador @jsquash/avif para AVIF. No se inserta ningún paso de ampliación. Si tu selección mide 800 píxeles de ancho, la salida mide 800 píxeles de ancho. Los preajustes de redes sociales (1080x1080 para Instagram, 1280x720 para YouTube) se entregan a esas medidas solo cuando la imagen original contiene suficientes píxeles para llenar la selección.
Eliminación de metadatos EXIF y lo que se pierde
Cada exportación elimina los datos EXIF, IPTC, XMP y el perfil ICC. Esto ocurre a nivel del pipeline del lienzo: el navegador dibuja los píxeles decodificados de la imagen sobre un HTMLCanvasElement y el lienzo codifica un archivo nuevo. El lienzo no tiene noción de contenedores de metadatos, solo almacena valores de píxeles y parámetros de codificación. Lo que se elimina incluye coordenadas GPS, marca y modelo de cámara, distancia focal del objetivo, ajustes de exposición, campos de copyright y etiquetas de perfil de color. El perfil de color sRGB es efectivamente la asunción que hace el lienzo: los colores se procesan a través del pipeline de visualización del navegador y se vuelven a codificar sin un perfil adjunto. Para la mayoría de los usos de publicación web y redes sociales, eliminar EXIF es preferible porque los datos GPS pueden exponer información de ubicación que el usuario no quiso compartir. Para flujos de trabajo de fotografía profesional donde la precisión del perfil de color importa, ten en cuenta que la fidelidad del perfil ICC no se preserva y se debe usar una herramienta de exportación con gestión de color para entregar a imprenta o publicación.
Qué ocurre al recortar un GIF animado
Cuando arrastras un GIF animado a la herramienta de recorte, el navegador decodifica solo el primer fotograma en el elemento de imagen utilizado por el lienzo de recorte. Este es un comportamiento del navegador, no una limitación de cropperjs: el HTMLImageElement no expone los fotogramas individuales de un GIF animado a JavaScript de forma que la API del lienzo pueda iterarlos. El resultado es que solo el primer fotograma está disponible para la selección de recorte y la salida final es una imagen estática en el formato que elijas en la pantalla final. Si la entrada es un GIF y eliges GIF como salida, la implementación canvas.toBlob del navegador no incluye un codificador GIF, así que la salida cae silenciosamente a PNG. La herramienta rechaza explícitamente GIF como opción de formato de salida para evitar esa degradación silenciosa. Si necesitas recortar todos los fotogramas de una animación, harías falta una herramienta que trabaje fotograma a fotograma, algo que esta herramienta no admite.
Navegación por teclado y accesibilidad
El elemento de selección de cropperjs v2 implementa la navegación por teclado como parte de su especificación de Web Component. Una vez que llegas con Tab a la selección de recorte, las teclas de flecha mueven el marco un píxel a la vez en la dirección pulsada. Mayús más una tecla de flecha mueve el marco diez píxeles. Es accesible de forma nativa sin un atajo de lector de pantalla ni una capa JavaScript personalizada: el manejador de teclado vive dentro del shadow root del elemento de selección y se dispara en keydown. Esto importa para usuarios que dependen de la navegación solo con teclado, incluidas algunas configuraciones de tecnologías de asistencia, dispositivos de accesibilidad motora y flujos de precisión donde un trackpad no consigue una alineación subpíxel fiable. La lectura en vivo de píxeles adjunta a la selección también se actualiza con cada pulsación, así que los usuarios de lector de pantalla con regiones aria-live sobre la lectura pueden oír cómo cambian las dimensiones actuales. La accesibilidad por teclado es un área donde esta herramienta va por delante de iLoveIMG e img2go, que no implementan navegación de recorte con teclas de flecha.
Compromisos entre formatos tras el recorte
El selector de formato en la pantalla final ofrece cuatro opciones. PNG es sin pérdida: cada píxel del área de recorte se almacena exactamente como se decodificó del origen. El tamaño del archivo es mayor que JPG para el mismo contenido, normalmente tres a cinco veces mayor para una foto. JPG aplica compresión con pérdida a calidad 0,9 (en una escala de 0 a 1), equivalente aproximadamente al preajuste de alta calidad en la mayoría de editores de escritorio. A q0,9 la diferencia entre el original y la salida no suele ser visible en un monitor estándar pero el archivo es notablemente menor. WebP con el mismo ajuste de calidad produce un archivo entre un 25 y un 35 por ciento menor que JPG en nuestras pruebas de codificación, con la misma calidad perceptual en fotos. WebP también admite un modo sin pérdida y preserva la transparencia. AVIF a calidad 0,9 mediante la biblioteca @jsquash/avif produce la salida más pequeña de los cuatro formatos pero la primera codificación en una sesión requiere descargar un módulo WASM de 870 KB. Las codificaciones AVIF posteriores en la misma pestaña son rápidas porque el módulo ya está cargado.