Inspect the rendered page
Pick any element and see the rules, computed styles, DOM context, colors, and layout values behind it.
InnerScope browser extension
See inside every page.
InnerScope is a CSS inspector and network debugger that lives in your browser's side panel.
Inspect and edit styles, capture, replay and mock network requests, scan for design tokens and accessibility issues, and drive it all from a command palette. No account, no server, no telemetry—everything runs locally in your browser.
Optional local MCP bridge · One-time purchase
INNERSCOPE · NETWORK Capturing locally
POST /api/checkout 200 · 184ms
type: fetch · GraphQL: CreateOrder
content-type: application/json
Breakpoint matched: method:POST url:/api
Request held · Edit, resume, or drop
One panel. Full context.
Inspect the interface and the traffic behind it.
Debug every request
Capture, filter, replay, edit, mock, rewrite, and compare browser network traffic.
Edit CSS live
Change selectors, properties, and values in the side panel and apply them directly to the page.
Find browser errors
Review console output, page errors, GraphQL operations, response bodies, and request timing.
Scan design quality
Collect design tokens, compare elements, and catch common accessibility issues.
Private by design
No account, server, analytics, or telemetry. Everything runs locally in your browser.
Inspect tab
Understand and edit the page.
- Click-to-pick element inspection with matched CSS rules, @media and @layer context, computed styles, and the DOM tree.
- Live editing for selectors, properties, and values, applied directly back to the page.
- Design-token scanning for colors, font families, font sizes, and spacing values, with usage counts and one-click copy.
- Accessibility quick scans for missing alt text, unlabeled controls, WCAG contrast ratios, and undersized tap targets.
- Side-by-side element comparison across 27 computed-style properties.
- Color swatches, collapsible HTML trees, and interactive JSON tree views.
Network tab
Capture, replay, and reshape traffic.
- Live capture of fetch, XMLHttpRequest, sendBeacon, WebSocket frames, and SSE, including headers, bodies, timing, and GraphQL operation detection.
- Replay requests with their original cookies and session, or edit the method, URL, headers, and body before sending.
- Copy requests as cURL, fetch(), or PowerShell—with secret-including options off by default—or export a filtered LLM-friendly pack.
- Filter with queries such as method:POST, status:404, body:email, and url:/api, then save presets.
- DevTools-style sortable, resizable columns with waterfall timing, grouping, and visibility controls.
- Hold matching requests at breakpoints, then resume, edit, or drop them.
- Mock responses, rewrite URLs and headers, inject delays or errors, and organize wildcard or regex rules into toggleable sets.
- Diff responses, import and export HAR, preserve logs, save favorites, and back up complete sessions.
Command palette
Press Ctrl+K or ⌘K from anywhere.
Fuzzy-search commands to switch tabs, toggle views, arm breakpoints, export HAR, run scans, and more—without leaving the keyboard.
Lightweight and open
Manifest V3. Vanilla JavaScript. Zero npm dependencies.
No build step. Dark Catppuccin Mocha and light themes included. Requires Chrome 116+ or a Chromium browser with MV3 side-panel support.
Frequently asked questions
A few things to know.
What is InnerScope?
InnerScope is a CSS inspector and network debugger that lives in your browser side panel. It combines page inspection, live CSS editing, network capture, replay and mocking, design-token discovery, accessibility checks, and a command palette.
Does InnerScope send my browsing data to a server?
No. InnerScope has no account, analytics, or telemetry. Captured data is stored locally in your browser profile through chrome.storage.local.
Which browsers are supported?
InnerScope requires Chrome 116 or newer. It also works in Chromium browsers with Manifest V3 side-panel support, including Brave and Edge.
Can InnerScope replay and mock network requests?
Yes. You can replay requests in the page session, edit requests before sending, hold them at breakpoints, return synthetic responses, rewrite URLs or headers, and inject delays or network errors.
How are authorization headers and cookies protected?
Options that copy secrets such as Authorization headers and cookies are disabled by default. Only enable them when you understand where the copied data will be used.
What does InnerScope Bridge add?
The optional local Bridge exposes a focused set of InnerScope browser tools to compatible MCP clients such as Cursor and Claude Code. It is a one-time $5 purchase, not a subscription.
How do I remove stored data?
Uninstalling InnerScope removes its locally stored extension data. You can also clear the extension’s local storage from your browser settings.
Need help installing or using InnerScope? Visit Support.
InnerScope Privacy Policy