Cómo eliminar fondos de imágenes directamente en el navegador sin servidores ni suscripciones

Cada vez que necesitas eliminar rápidamente el fondo de una foto para un proyecto personal, una tarjeta de producto o un avatar, comienza la misma búsqueda. Servicios populares en línea como Remove.bg exigen una suscripción de pago después de tres descargas, comprimen la imagen al tamaño de un sello de correos o requieren autorización con Google. Además, no siempre quieres enviar fotos personales o maquetas de trabajo a servidores de terceros.

Hace poco encontré el repositorio cut-it-out del desarrollador Suvink. Es una herramienta de código abierto que hace lo mismo, pero directamente en el navegador del usuario. Sin backends, sin colas y sin costos para infraestructura de terceros.

Qué hay bajo el capó

Lo principal del proyecto es que todos los cálculos ocurren del lado del cliente. El repositorio utiliza la biblioteca @imgly/background-removal, que carga el modelo de red neuronal U2-Net a través de ONNX Runtime en WebAssembly (WASM).

Si antes ejecutar inferencia para redes de segmentación requería un servidor con Python, PyTorch y al menos una modesta GPU, ahora la combinación WASM + WebGL/WebGPU lo maneja directamente en una pestaña de Chrome o Firefox.

Cuando abres la página por primera vez, el navegador descarga los pesos del modelo, los guarda en caché y luego procesa los archivos entrantes localmente. Ningún dato sale de tu máquina. Puedes desconectar tu portátil de internet, arrastrar una imagen a la ventana y la máscara se generará en un par de segundos.

Herramientas para refinamiento manual

Las redes neuronales suelen cometer errores en bordes complejos. Pelos finos, cristal transparente o un fondo ligeramente desenfocado a menudo se convierten en bordes irregulares. Los creadores de CutItOut no se limitaron a un único botón de "Eliminar fondo" y añadieron varias herramientas útiles de corrección manual:

• Pincel mágico. Selecciona píxeles vecinos por similitud de color, lo que ayuda a borrar rápidamente un trozo de fondo que quedó de forma incómoda.
• Modo de recuperación con capa semitransparente (superposición fantasma). Cuando la red neuronal corta demasiado, es difícil restaurar un fragmento necesario sin referencia visual. Aquí el original se resalta con un contorno suave, para que puedas ver exactamente dónde pintar.
• Navegación por el lienzo. Hay zoom y desplazamiento para limpiar con precisión pequeños detalles en alta resolución.
• Exportación sin pérdidas. El resultado final se entrega como PNG con un canal alfa transparente en la resolución original, sin marcas de agua ni temporizadores de espera.

Cómo desplegar el proyecto tú mismo

El código está escrito en TypeScript y se compila con herramientas estándar de desarrollo frontend. Para ejecutar el proyecto localmente o usarlo como base para tu propio servicio, necesitarás Node.js 18+ y npm 9+.

Clona el repositorio y navega a la carpeta:

git clone https://github.com/Suvink/cut-it-out.git
cd cut-it-out

Instala las dependencias:

npm install

Inicia el servidor de desarrollo local:

npm run dev

Vite arrancará la aplicación en http://localhost:5173.

Si quieres desplegar la aplicación tú mismo, el proyecto genera archivos estáticos con un solo comando:

npm run build

Todos los archivos terminados se guardarán en el directorio dist. Como el proyecto no necesita ningún backend en absoluto, puedes subir estos archivos a cualquier hosting estático gratuito como Vercel, Netlify o GitHub Pages. No hay contenedores Docker, variables de entorno con claves API ni configuraciones de colas Celery que configurar.

Por qué este proyecto es útil para desarrolladores

El código de CutItOut es interesante desde dos perspectivas.

Primero, es una utilidad lista para usar de forma cómoda para uso personal. Puedes ejecutarlo en un servidor doméstico o mantenerlo en marcadores para evitar pagar por alternativas comerciales cuando necesites preparar un par de docenas de imágenes.

Segundo, el proyecto es una gran ilustración del enfoque de edge computing en frontend. Si estás construyendo una aplicación donde los usuarios suben avatares o fotos de productos, mover la segmentación al cliente ahorra una buena cantidad de dinero. En lugar de pagar por instancias de GPU en la nube, transfieres el trabajo a la CPU del usuario. En el repositorio puedes ver cómo el autor organizó el trabajo con el lienzo, el escalado y la integración de la biblioteca WASM en la interfaz.

CutItOut es un proyecto limpio y honesto bajo licencia Apache 2.0. Resuelve un problema cotidiano específico y demuestra claramente lo lejos que han llegado las capacidades de aprendizaje automático en el navegador. El proyecto aún no tiene muchas estrellas, pero el código es limpio, comprensible y fácilmente adaptable a tus propias tareas.