Desenfocar fondo de webcam

¿Cómo funciona la herramienta?

La herramienta accede a la webcam mediante la API estandarizada del navegador getUserMedia(). El permiso de cámara no se solicita en segundo plano ni sin conocimiento del usuario — el navegador siempre muestra un diálogo de permiso visible.

El flujo de cámara se recibe en un elemento <video> oculto y se transfiere fotograma a fotograma a un elemento <canvas>. Allí se aplica un filtro CSS que genera el desenfoque. En Chrome 114+ con hardware de webcam compatible, está adicionalmente disponible la API W3C nativa backgroundBlur: separa persona y fondo directamente a nivel de hardware, de modo que la persona se mantiene nítida y solo el fondo se desenfoca.

Cadena de renderizado: Cámara → getUserMedia → elemento de vídeo oculto → composición en Canvas → Canvas visible

Todo el proceso se ejecuta en el hilo del navegador. Ningún fotograma, ningún píxel abandona la pestaña. Al cerrar la página o al hacer clic en «Terminar cámara», todas las pistas de cámara se cierran inmediatamente mediante track.stop().

¿Cómo se desenfoca el fondo?

Abra la herramienta y haga clic en Iniciar cámara. El navegador solicita una vez el permiso de cámara — este diálogo proviene del sistema operativo y no puede ser eludido. Permita el acceso, y el flujo aparece directamente en la herramienta.

Active el interruptor de desenfoque de fondo. A continuación, mueva el control deslizante de intensidad al valor deseado:

• 1–5: Impresión de profundidad de campo discreta — el fondo está ligeramente desenfocado, los detalles aún son reconocibles.
• 6–12: Desenfoque natural — buen valor predeterminado para videollamadas, con el fondo claramente separado.
• 13–20: Desenfoque fuerte — fondo completamente neutralizado.

Puede observar el efecto en vivo en el Canvas. Mediante Guardar instantánea, el fotograma actual se descarga como PNG.

Privacidad — 100 % en el navegador

Los datos de cámara son particularmente sensibles. La herramienta está construida, por tanto, de modo que nada abandona el navegador:

• Sin subida: ningún fotograma, ninguna imagen, ninguna vista previa en miniatura se envía a un servidor.
• Sin CDN para datos de cámara: a diferencia de las herramientas basadas en modelos de aprendizaje automático (como el eliminador de fondo), aquí no es necesario cargar ningún modelo. No hay conexión de red externa durante el uso.
• Limpieza del flujo: al abandonar la página o al hacer clic en «Terminar cámara», la herramienta invoca track.stop() en todas las pistas de cámara. El LED de la webcam se apaga inmediatamente.
• Sin cookies, sin rastreo: la herramienta no establece cookies para datos de cámara.

¿Qué compatibilidad de navegador y hardware se necesitan?

Situación	Lo que ocurre
Chrome 114+ con webcam compatible	Desenfoque de fondo nativo: persona nítida, fondo desenfocado
Chrome 114+ con webcam más antigua (p. ej. C310)	Recurso alternativo: filtro a pantalla completa
Firefox, Edge, Safari 16.4+	Filtro CSS a pantalla completa (fondo y persona se desenfocan)
Safari < 16.4 o IE	Sin soporte getUserMedia — aparece mensaje de aviso

La segmentación nativa sin extensión actualmente solo es posible en Chrome 114+ en Windows con hardware de webcam compatible. La especificación W3C Media Capture Extensions está en fase de borrador — Firefox y Safari aún no han anunciado planes de implementación. La herramienta usa la API nativa como mejora progresiva, de modo que los usuarios de Chrome obtienen la mejor experiencia, mientras que todos los demás navegadores obtienen igualmente un desenfoque a pantalla completa útil.

Preguntas frecuentes

Las consultas más frecuentes sobre la herramienta:

¿Se suben mis datos de cámara?

No. El procesamiento de imagen se ejecuta exclusivamente en local en su navegador. Ningún fotograma, ninguna captura, ningún metadato abandona su dispositivo.

¿Funciona la herramienta sin instalación?

Sí. Sin tienda de extensiones, sin descarga de aplicación de escritorio, sin cuenta. La pestaña del navegador es todo lo que se necesita.

¿Por qué mi persona también queda desenfocada?

En navegadores sin API de segmentación nativa (Firefox, Edge) o en hardware sin soporte (webcams más antiguas) se ejecuta un filtrado a pantalla completa. Para un desenfoque puramente de fondo, se recomienda Chrome 114+ con una webcam moderna.

¿Puedo usar la herramienta para videollamadas en Zoom o Teams?

Indirectamente: esta herramienta no es un controlador de cámara virtual — solo muestra el flujo procesado en la pestaña del navegador. Para el uso en Zoom o Teams se necesitan herramientas como OBS con el complemento VirtualCAM o software VCam. La herramienta resulta adecuada para videollamadas basadas en navegador (Google Meet, Jitsi) o como vista previa.

¿Qué herramientas de vídeo están relacionadas?

Otras herramientas del ecosistema kittokit que encajan con el tema:

• HEVC a H.264 — Convertir vídeos de iPhone a MP4 universalmente reproducible, directamente en el navegador sin subida.
• Eliminar fondo — Recortar el fondo de fotos con segmentación por IA, completamente del lado cliente.
• Convertidor de formato de imagen — Convertir imágenes a WebP, AVIF y más, con comparación de formatos y herramientas dedicadas por par de formatos, para tamaños de archivo más pequeños sin pérdida de calidad.