Chrome Cdp

This connects Claude directly to your running Chrome browser via the DevTools Protocol. You can screenshot tabs, grab accessibility trees, evaluate JavaScript, click elements, and navigate pages across 100+ open tabs without spinning up Puppeteer. Each tab prompts for permission once, then a background daemon keeps the connection alive. The coordinate system is straightforward: screenshots are in native pixels, clicks use CSS pixels, and it tells you the DPR for conversion. Useful when you want Claude to inspect or interact with actual browser state during debugging sessions or when you need to automate something across your real tabs without switching contexts.

skills.sh installs: 226
GitHub stars: 4
last updated: Jun 3, 2026

View on GitHub

Install

$ npx -y skills add hanyu0001/chrome-cdp-skill --skill chrome-cdp --agent claude-code

Installs into .claude/skills of the current project.

Files

Chrome CDP

Lightweight Chrome DevTools Protocol CLI. Connects directly via WebSocket — no Puppeteer, works with 100+ tabs, instant connection.

Prerequisites

Chrome (or Chromium, Brave, Edge, Vivaldi) with remote debugging enabled: open chrome://inspect/#remote-debugging and toggle the switch
Node.js 22+ (uses built-in WebSocket)
If your browser's DevToolsActivePort is in a non-standard location, set CDP_PORT_FILE to its full path

Commands

All commands use scripts/cdp.mjs. The <target> is a unique targetId prefix from list; copy the full prefix shown in the list output (for example 6BE827FA). The CLI rejects ambiguous prefixes.

List open pages

scripts/cdp.mjs list

Take a screenshot

scripts/cdp.mjs shot <target> [file]    # default: screenshot-<target>.png in runtime dir

Captures the viewport only. Scroll first with eval if you need content below the fold. Output includes the page's DPR and coordinate conversion hint (see Coordinates below).