Las Herramientas para desarrolladores de Chrome son un conjunto de herramientas para desarrolladores web que están integradas directamente en el navegador Google Chrome. Las Herramientas para desarrolladores pueden ayudarte a editar páginas sobre la marcha y diagnosticar problemas rápidamente, lo que te ayuda a crear mejores sitios web, más rápido.
Todas las formas en las que puedes abrir las Herramientas para desarrolladores de Chrome.
Mantente actualizado con los cambios más recientes de Herramientas para desarrolladores.
Serie de videos breves que te ayudarán a conocer las funciones en Herramientas para desarrolladores.

Comandos y accesos directos

Realiza tareas rápidamente.
Una guía sobre cómo abrir el menú de comandos, ejecutar comandos, abrir archivos, ver otras acciones y mucho más.
Documentación canónica de las combinaciones de teclas de las Herramientas para desarrolladores de Chrome.
Consulta el aspecto y el comportamiento de una página web cuando JavaScript está inhabilitado.
Usa dispositivos virtuales en el Modo de dispositivo de Chrome para crear sitios web que prioricen los dispositivos móviles.
Encuentra texto en todos los recursos cargados con la pestaña Buscar.

Paneles

Descubre la potencia de cada panel de Herramientas para desarrolladores.
Aprende a ver y cambiar el DOM de una página con las Herramientas para desarrolladores de Chrome.
Aprende a ver y cambiar el CSS de una página con las Herramientas para desarrolladores de Chrome.
Registra mensajes y ejecuta JavaScript.
Visualiza y edita archivos, crea fragmentos, depura JavaScript y configura un lugar de trabajo.
Registra las solicitudes de red.
Evalúa el rendimiento del sitio con Herramientas para desarrolladores.
Encuentra problemas de memoria que afecten el rendimiento de la página, como fugas o aumentos de memoria, y recolecciones frecuentes de elementos no utilizados.
Inspecciona, modifica y depura apps web, prueba la caché y visualiza el almacenamiento.
Graba, vuelve a reproducir, mide los flujos de usuarios y edita sus pasos.
Descubre una colección de opciones que afectan el procesamiento del contenido web.
Detectar y solucionar problemas en tu sitio web
Usa el panel Seguridad para asegurarte de que una página esté completamente protegida por HTTPS.
Inspecciona un ArrayBuffer, TypedArray o DataView en JavaScript, además de WebAssembly y la memoria de las apps de Wasm para C++.
Anula la string del usuario-agente. Inhabilita la opción Seleccionar automáticamente y elige una opción de la lista o ingresa una cadena personalizada.
Usa el panel Contenido multimedia para ver información y depurar los reproductores multimedia por pestaña del navegador.
Inspecciona y modifica animaciones con la pestaña Animaciones.
Realiza un seguimiento de los cambios en HTML, CSS y JavaScript.
Busca y analiza código JavaScript y CSS sin usar en las Herramientas para desarrolladores de Chrome.
Usa la pestaña del panel lateral de recursos para desarrolladores a fin de verificar si los mapas de origen se cargan correctamente y, luego, cargarlos de forma manual.
Identifica las posibles mejoras de CSS con el panel Resumen de CSS.
Optimiza la velocidad del sitio web con el panel de Lighthouse.
Obtén estadísticas prácticas sobre el rendimiento de tu sitio web con el panel Estadísticas de rendimiento.
Emular los sensores del dispositivo
Emula autenticadores.