awesome-chrome-devtools
github.com/chromedevtools/awesome-chrome-devtools ↗Awesome tooling and resources in the Chrome DevTools & DevTools Protocol ecosystem
Use this list with your AI agent
Add the Context Awesome MCP server to Claude, Cursor, or any MCP client, then ask:
"Show me workflow resources from awesome-chrome-devtools"
Installation instructions →What's inside
DevTools Extensions
- Angular DevToolsWorkflow
Debugging and Profiling for Angular applications.
- Backbone DebuggerWorkflow
Inspect a Backbone application's views, models, events, and routes.
- BEM devtoolsWorkflow
Inspect BEM entities expressed in
- ClockworkWorkflow
View PHP application profiling data.
- Ember.js InspectorWorkflow
Allows you to inspect Ember.js objects in your application.
- InsightWorkflow
A WebGL debugging toolkit which enables more productive WebGL development and more efficient WebGL applications.
DevTools tooling and ecosystem
- betwixtNetwork Inspection
System level network proxy, providing inspection via Network panel.
- call-traceCPU profile
Can instrument your JS with hooks, and then generate a
- ChromeREPLChrome Debugger integration with Editors
Within Sublime Text, use the Chrome console.
- cpuprofilifyCPU profile
Converts output of various profiling/sampling tools to the
- DevTools Timeline ViewerTimeline, Tracing & Profiling
Share URLs of your timeline recordings.
- immutable-devtoolsObject formatting
Custom formatter for Immutable-js values.
Applications
- BrowserBoxBrowsers
Embed Chrome in a web page, largely powered by DevTools and supporting multiuser browsing, remote DevTools, audio, and documents like
- dnWeb Archivers and Indexers
Archive and index pages you browse for offline viewing and search, implemented using the
- PuppetromiumBrowsers
A proof-of-concept web browser built with Puppeteer, written in Node.js, HTML and CSS, with 0% client-side JavaScript.
Learning
- Can I DevTools?
Various workflows, documented. Also a weekly tips & tricks
- Chrome Secret Menus
Comprehensive guide to internal pages and diagnostic tools in Chrome.
- Dear Console
A collection of snippets to use in the browser console.
- Dev Tips
Large collection of tips as animated gifs.
- DevTools Tips
Collection of illustrated tips as mini tutorials.
- Front-end Debugging Tools Handbook
Practical guide to mastering front-end debugging tools, from Chrome DevTools and framework extensions to AI-enhanced IDE debugging.
Chrome DevTools Protocol
- cdpLibraries for driving the protocol (or a layer above)
- ChromeControllerLibraries for driving the protocol (or a layer above)
high-level browser mgmt
- chrome-debugging-clientLibraries for driving the protocol (or a layer above)
- chrome-dev-toolsLibraries for driving the protocol (or a layer above)
Protocol wrapper generator that can be customized by editing handlebars templates. Includes .Net Core template.
- ChromeDevTools/devtools-protocol
- chrome-devtools-java-clientLibraries for driving the protocol (or a layer above)
Using DevTools frontend with other platforms
- chrome-devtools-frontend
Mirror of the frontend that ships in Chrome.
- Debugging Node.js with Chrome DevTools
Guide on using the full debugging and profiling support in Node v6.3+.
- Dirac
Debugging of ClojsureScript.
- Facebook Stetho
Native Android debugging with Chrome DevTools.
- j2v8-debugger
Debugging JavaScript running in
- ndb
An improved Node.js debugging experience with the DevTools Frontend.
Alumni
- DevTools Backend
Standalone implementation of the Chrome DevTools backend to debug arbitrary web environments.
- DevTools Remote
Remotely debug someone else's browser.
- go-debugger-devtools
- IE Diagnostics Adapter
Protocol adaptor for Microsoft IE 11 to CDP.
- ios-webkit-debug-proxy
Builts upon ios-webkit-debug-proxy and translates WebKit's Remote Debugging Protocol API to the CDP.
- pychrome
low level CDP transport handler
Showing a sample of 91 resources. View the full list on GitHub →