DevTools
Chrome DevTools is a set of web developer tools built directly into the Google Chrome browser. DevTools lets you edit pages on-the-fly and diagnose problems quickly, which helps you build better websites, faster.
Debug with AI
Explore how AI innovations in DevTools let you do more, faster. Use DevTools for agents to connect the power of DevTools to your favorite coding agents.
AI innovations
Let Gemini help you analyze and improve your website's styling, network, sources, and performance. Get help with console errors, and code suggestions in the Console and Sources panels.
DevTools for agents
Give your coding agents the same trusted tools you use to inspect network activity, record traces, and troubleshoot web applications, within your AI workflow.
Connect the Chrome DevTools MCP (Model Context Protocol) server to your tool of choice: Antigravity, Claude Code, Cline, Copilot, and more.
Understand performance
Get a comprehensive and actionable view of your page's performance.
Inspect resources
Learn how to inspect resources loaded by your page and edit them from your browser.
Analyze network
Analyze and overwrite network requests and responses on the fly.
Developer Tooling Tips
Explore our monthly video series taking you through common debugging scenarios in DevTools in a playful way.
Emulate user experiences with coding agents
Chrome DevTools for agents lets your agent verify responsive layouts, test location-aware APIs, and simulate varied CPU or network speeds.
Automate Lighthouse audits with coding agents
Lighthouse in Chrome DevTools for agents lets your coding agent evaluate website quality by performing live health checks for accessibility, SEO, best practices, and agentic browsing.
Performance optimization Pitstop
Get a tour through the updated Performance panel, showing you how to measure Core Web Vitals (LCP, CLS, INP) and how to get tailored advice from Gemini.
Pixel Pirate
Set sail with DevTools and become a debugging pirate! Discover techniques for emulating focus styles, testing forms with autofill, and resolving backend errors with network overrides.
Get performance insights
A wide range of tools to help you measure and optimize different aspects of your runtime performance: the Performance panel, Lighthouse, and more.
Performance tool overview
Learn about all the features in the Performance panel: how to record a performance trace, how to view and analyze the trace, and more.
Learn about the new performance insights, the power of Lighthouse directly in the DevTools Performance panel.
News & updates
Inspect and edit resources
Feature reference
Learn about all the features in the Sources panel: how to view and edit files, debug JavaScript, and set up a workspace.
Set up a workspace
Workspace lets you to save changes that you make within DevTools to source code that's stored on your computer. Learn how to set up a workspace in your own projects.
Analyze network activity
Network panel
Learn about all the features in the Network panel: inspect response and request bodies, overwrite headers, and more.
More tools
Discover all the other features and capabilities in DevTools.