Recorta cualquier imagen en círculo online

Sube un JPG, PNG, WebP o AVIF y descarga un círculo transparente en segundos.

o arrastra la imagen aquí

Acerca de esta herramienta

Recorta cualquier foto en un círculo perfecto directamente en tu navegador. Suelta un JPG, PNG, WebP o AVIF sobre la página y Cropper.js lo abre en un editor circular con máscara. Arrastra los controles para centrar el sujeto, ajusta el tamaño del círculo sobre la zona que quieres mostrar y pulsa Guardar. El navegador codifica el resultado como PNG transparente, WebP o AVIF, o como JPEG plano si eliges un color de fondo, y lo descarga directo a tu dispositivo. La pestaña Red de las DevTools no muestra ninguna petición de salida con datos de imagen durante todo el proceso. Se aceptan archivos de hasta 25 MB y 16 megapíxeles. La herramienta funciona en escritorio y móvil sin instalar nada. La usan principalmente quienes necesitan que una foto o logo quede bien dentro del recorte circular de perfiles en LinkedIn, Discord, Slack e Instagram.

Abrir el editor de recorte circular
Cómo recortar una imagen en círculo

Cómo recortar una imagen en círculo

Suelta un JPG, PNG, WebP o AVIF sobre la página y Cropper.js v2 lo carga en un editor circular con máscara. Una capa oscura te muestra el área que se cortará y el círculo brillante en el centro es lo que queda. Arrastra el círculo para centrar a tu sujeto, ajusta el tamaño con los controles de esquina o pellizca en pantalla táctil. Cuando el encuadre te convenza, elige un formato y pulsa Guardar. El navegador codifica el archivo de forma local y dispara la descarga. Abre la pestaña Red de las DevTools mientras recortas y verás que se mantiene vacía. Ninguna petición POST se dispara durante la subida, el arrastre o el guardado.

Elegir formato y recortar
Elige el formato de salida

Elige el formato de salida

Hay cuatro formatos en el menú de descarga. PNG mantiene transparente toda el área fuera del círculo y es la opción segura por defecto para avatares y logos. WebP también admite transparencia y suele pesar entre un 25 y un 35 por ciento menos que PNG. AVIF es el más pequeño de los tres formatos transparentes, a menudo la mitad del tamaño de WebP, pero el codificador @jsquash/avif tarda alrededor de 3 segundos en escritorio y hasta 30 segundos en un móvil de gama media. JPEG produce un círculo plano sobre un color de fondo sólido que tú eliges. No tiene canal alfa, así que la transparencia se sustituye por ese color de relleno. Elige PNG por fiabilidad, WebP por tamaño, AVIF cuando el ancho de banda importe y JPEG solo cuando el destino rechace archivos transparentes.

Recortar para cualquier red social
Fotos redondas para cada plataforma

Fotos redondas para cada plataforma

La mayoría de redes sociales muestran avatares dentro de una máscara circular, así que recortar antes te deja controlar qué cae dentro. LinkedIn muestra la foto de perfil a 400 por 400 px como mínimo en la página de perfil y a unos 48 px en el feed. Discord renderiza el avatar de usuario a 128 por 128 en las listas de miembros del servidor y a 32 por 32 en el chat. Instagram muestra la foto de perfil en círculo a unos 110 px en móvil y a 32 px en las miniaturas del feed. Slack usa 36 px en la lista de canales. La herramienta exporta a la resolución original, así que redimensiona primero en /resize/ si necesitas un tamaño en píxeles concreto. Eso evita artefactos por ampliación.

Probar dentro de los límites
Lo que esta herramienta no hace

Lo que esta herramienta no hace

Los archivos por encima de 25 MB o de más de 16 megapíxeles se rechazan con un error amigable. La comprobación se hace sobre los magic bytes y las dimensiones del header, antes de decodificar, así que una foto de 50 megapíxeles de una DSLR nunca tumba un navegador móvil. Los archivos HEIC solo decodifican en Safari 17 y posteriores, que exponen createImageBitmap para ese formato de forma nativa. Chrome, Firefox y Edge devuelven un error de decodificación y la herramienta sugiere convertir a JPG primero. Los GIF animados exportan solo el primer fotograma. La codificación AVIF es lenta en móvil, alrededor de 30 segundos para una entrada de 8 megapíxeles. La posición del círculo siempre es manual. No hay detección automática de caras o sujetos por IA.

Recortar en tu navegador ahora
Cómo tu imagen permanece en tu dispositivo

Cómo tu imagen permanece en tu dispositivo

Cropper.js dibuja la máscara dentro de la Canvas API del navegador. La codificación también corre de forma local, a través de canvas.toBlob para PNG, WebP y JPEG, o del módulo WASM @jsquash/avif para AVIF. El archivo descargado viene de una URL blob creada con URL.createObjectURL, que apunta a memoria que el navegador mantiene para tu pestaña. Abre las DevTools, ve a la pestaña Red, límpiala, luego sube una imagen y recórtala. No aparece ninguna petición POST o PUT nueva con los datos de la imagen. Al pulsar Guardar, una única petición a una URL blob: parpadea durante una fracción de segundo en el panel. Eso es el navegador resolviendo el blob local, no enviando datos a un servidor. Funciona igual en Chrome, Firefox, Safari y Edge.

Crea tu foto de perfil redonda
Foto de perfil redonda para cada red social

Foto de perfil redonda para cada red social

Una foto de perfil importa porque es lo primero que ven los demás. La mayoría de plataformas renderiza avatares en un círculo, así que el cuadrado que subes se recorta en los bordes. Hacer el recorte tú mismo controla qué queda dentro del círculo y qué se cae. Lo mismo aplica a los logos redondos de marca, las insignias de fotos de equipo en un directorio, los iconos de servidor en Discord y el arte de pegatinas. Una cosa que conviene notar: un retrato luce mejor con un pequeño margen alrededor de la cabeza, no con un encuadre apretado justo en el nacimiento del pelo. Centra los ojos un poco por encima del medio del círculo y el resultado se ve equilibrado en cualquier tamaño de renderizado.

Cómo recortar una foto en círculo

  1. Sube tu imagen

    Haz clic en el área de carga o arrastra un archivo JPG, PNG, WebP, AVIF o GIF directamente. El editor de recorte circular se abre de forma automática.

  2. Posiciona el círculo sobre tu sujeto

    Arrastra el círculo para centrar tu cara o logo. Pellizca o desplaza para ajustar el tamaño hasta que el encuadre sea el que quieres.

  3. Elige el formato de salida

    Selecciona PNG o WebP para un círculo transparente, AVIF para el archivo más pequeño, o JPEG si necesitas un color de fondo sólido.

  4. Pulsa Guardar y descarga el archivo

    El navegador codifica el resultado de forma local y lo descarga a tu dispositivo. El nombre del archivo conserva el nombre original con -circle añadido.

¿Necesitas un rectángulo, no un círculo?

Esta herramienta ofrece una sola forma, el círculo. Para rectángulos con ratio libre usa recortar imagen. Para feed de Instagram (1080 por 1080) usa una de las herramientas de recorte por plataforma.

Preguntas frecuentes

¿Cómo cortar la imagen en un círculo?

Sube tu imagen (JPG, PNG, WebP, AVIF, GIF o BMP) al editor. Cropper.js la abre con una selección circular ya centrada sobre la imagen. Arrastra el círculo para encuadrar tu sujeto, ajusta el tamaño con los controles de esquina o un gesto de pellizco y pulsa Guardar. El navegador codifica y descarga un PNG transparente por defecto. Todo el proceso lleva menos de 30 segundos con una foto normal.

¿Cómo recortar imagen en un círculo?

El proceso tiene cuatro pasos: subir la imagen, arrastrar el círculo sobre la zona que quieres, elegir el formato de salida (PNG, WebP, AVIF o JPEG) y pulsar Guardar. El editor usa Cropper.js v2, que aplica una máscara circular al exportar. No hace falta instalar nada. La herramienta funciona en cualquier navegador moderno, en escritorio y en móvil.

¿Qué formatos de imagen puedo descargar?

El menú de descarga ofrece cuatro opciones. PNG conserva la transparencia fuera del círculo y es el predeterminado. WebP suele ser un 25 a 35 por ciento más pequeño que PNG y también admite fondo transparente. AVIF es el más pequeño de los tres formatos transparentes pero puede tardar hasta 30 segundos en codificarse en un móvil de gama media. JPEG produce un círculo plano con el color de fondo que elijas, sin transparencia.

¿Puedo obtener un fondo transparente?

Sí. PNG, WebP y AVIF admiten canal alfa, así que el área fuera del círculo es completamente transparente. Al abrir el archivo descargado en la mayoría de programas de diseño o apps de mensajería, el fondo aparece como un tablero de ajedrez (señal de transparencia). JPEG no admite transparencia: al elegir JPEG se te pedirá que selecciones un color de relleno para el área exterior.

¿Para qué sirve recortar una imagen en círculo?

La mayoría de redes sociales muestran las fotos de perfil, avatares e iconos de servidor en un marco circular. Si subes una foto cuadrada y dejas que la plataforma la recorte, a menudo corta la cabeza o deja espacio muerto en el encuadre. Recortarla tú mismo en círculo te permite controlar exactamente qué queda visible antes de subir. Lo mismo aplica a logos redondos, insignias de equipo y arte de pegatinas de marca.

¿Funciona en el móvil?

La herramienta corre en cualquier navegador moderno en iPhone, iPad y Android. Los controles de arrastre responden a gestos táctiles y de pellizco. La limitación principal en móvil es el tiempo de codificación AVIF. Una foto de alta resolución puede tardar 30 segundos o más porque el codificador WASM usa la CPU. PNG y WebP son mucho más rápidos y funcionan bien en dispositivos de gama media.

Los detalles

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

Cómo Cropper.js v2 dibuja la máscara circular
Cropper.js v2 se distribuye como Web Component. Los elementos cropper-canvas, cropper-image y cropper-handle componen el editor. El recorte circular no es un truco de border-radius en CSS. Es una operación de composición en canvas (destination-in) que se aplica en el momento de exportar. El usuario ve la imagen completa con una capa oscura, y la región de selección circular se calcula en tiempo real a partir de las posiciones de los controles almacenadas en el estado interno del componente. Al pulsar Guardar, se crea un canvas temporal con las dimensiones seleccionadas, la imagen se dibuja sobre él y la máscara de composición elimina todo lo que queda fuera del círculo. Para PNG, WebP y AVIF el resultado incluye canal alfa. Para JPEG los píxeles transparentes se rellenan con un color sólido antes de codificar, porque JPEG no tiene especificación de canal alfa. Cropper.js v2 se publica con licencia MIT en github.com/fengyuanchen/cropperjs.
PNG, WebP, AVIF y JPEG para recortes circulares
PNG es sin pérdida y de soporte universal. Una exportación de círculo de 512 por 512 a partir de una foto de 8 megapíxeles pesa entre 180 y 350 KB según la complejidad de la foto. WebP es visualmente sin pérdida a calidad 85 a 90, entre un 25 y un 40 por ciento más pequeño que PNG, y compatible con todos los navegadores que han salido después de 2023. AVIF usa codificación intra AV1, normalmente entre un 40 y un 50 por ciento más pequeño que WebP con calidad visual equivalente, pero el codificador WASM @jsquash/avif tarda más. Unos 3 segundos en escritorio, y hasta 30 segundos en un móvil de gama media para una entrada de 8 megapíxeles. JPEG codifica más rápido, alrededor de 400 ms en escritorio, pero no tiene canal alfa. Úsalo solo cuando la plataforma de destino rechace archivos transparentes, como pasa con algunas integraciones de Slack y algunos clientes de correo. La mayoría de los usuarios debería elegir PNG por fiabilidad o WebP por tamaño.
Guía de tamaños por plataforma para avatares circulares
Cada plataforma renderiza avatares a distintos tamaños dentro de la máscara circular. LinkedIn: foto de perfil a 400 por 400 px como mínimo, mostrada en círculo en la página de perfil y a unos 48 px en el feed. Discord: icono de servidor (guild) a 512 por 512 máximo, avatar de usuario a 128 por 128 en las listas de miembros y 32 por 32 en el chat. Instagram: foto de perfil en círculo a unos 110 px en el perfil de móvil, 32 px en las miniaturas del feed. Slack: avatar de espacio de trabajo hasta 512 por 512, renderizado en círculo en la lista de canales a unos 36 px. La herramienta exporta a la resolución original de la foto. Si necesitas un tamaño de salida exacto, redimensiona la imagen primero usando /resize/ antes de ejecutar el recorte circular. Eso te da una salida con precisión de píxel sin artefactos por ampliación.
HEIC y la limitación exclusiva de Safari
HEIC es el formato contenedor de Apple que usa compresión HEVC. Safari 17 y posteriores maneja HEIC de forma nativa a través de createImageBitmap, por eso recortar en círculo una foto del iPhone funciona en Safari sin ningún paso de conversión. Chrome, Firefox y Edge no implementan createImageBitmap para HEIC a fecha de 2026. Devuelven un error de decodificación. La herramienta detecta los magic bytes al subir. Si se detecta un archivo HEIC en un navegador que no sea Safari, aparece un error amigable que sugiere convertir a JPG primero. La solución para usuarios sin Safari: abrir la foto en el iPhone en la app Fotos y compartirla como JPG (disponible en el menú de compartir), o usar /heic-to-jpg/ si ya tienes el archivo HEIC en un escritorio. Atención: un archivo .heic renombrado como .jpg sigue siendo rechazado, porque la detección comprueba los magic bytes, no la extensión.
Por qué el área fuera del círculo es transparente
Al exportar un recorte circular en PNG o WebP, los píxeles fuera del borde del círculo tienen un valor alfa de 0, completamente transparente. En plataformas que muestran avatares dentro de un marco circular, el fondo transparente se vuelve invisible y el color de fondo propio de la plataforma se ve limpiamente a través del recorte. En plataformas que muestran el archivo a tamaño completo, como una vista previa de adjunto o un álbum de fotos, el área transparente aparece como un tablero de ajedrez. Si pegas el círculo en una herramienta de diseño como Figma o Canva, puedes superponerlo sobre cualquier color sin un halo blanco. La opción JPEG existe para los casos en que la transparencia causa problemas. Algunos clientes de correo, algunos CMS de subida de imágenes y algunas plataformas antiguas eliminan la transparencia y la sustituyen por negro. Usar JPEG con un color de relleno elegido evita ese problema.
Verificar el procesamiento en el navegador con DevTools
Cualquiera puede verificar la afirmación de no subida de forma directa. Abre las DevTools del navegador (F12 o clic derecho y luego Inspeccionar), ve a la pestaña Red, haz clic en Limpiar para eliminar entradas anteriores, luego sube una imagen a la herramienta de recorte circular y arrastra los controles. Observa la pestaña Red durante la subida y el arrastre del recorte. Las únicas peticiones que aparecen son las de los recursos de la página (JS, CSS, fuentes) cargados antes de la subida. No aparece ninguna petición POST o PUT nueva con los datos de la imagen. Después de pulsar Guardar, una única petición a una URL blob: aparece en la pestaña durante una fracción de segundo. Eso es el navegador resolviendo el blob local, no enviando datos a un servidor. Esta verificación funciona en Chrome, Firefox, Safari y Edge.