Item logo image for WebGrabber for Claude Design

WebGrabber for Claude Design

snipki.de
Item media 4 (screenshot) for WebGrabber for Claude Design
Item media 1 (screenshot) for WebGrabber for Claude Design
Item media 2 (screenshot) for WebGrabber for Claude Design
Item media 3 (screenshot) for WebGrabber for Claude Design
Item media 4 (screenshot) for WebGrabber for Claude Design
Item media 1 (screenshot) for WebGrabber for Claude Design
Item media 1 (screenshot) for WebGrabber for Claude Design
Item media 2 (screenshot) for WebGrabber for Claude Design
Item media 3 (screenshot) for WebGrabber for Claude Design
Item media 4 (screenshot) for WebGrabber for Claude Design

Overview

Grab any element's HTML, CSS, and screenshot to paste into Claude Design. Independent tool, not affiliated with Anthropic.

WebGrabber for Claude Design is the fastest way to turn any page on the web into design context Claude can actually use. Click the toolbar icon (or hit Alt+Shift+C), hover any element, click to capture. The overlay records: • Matched CSS rules (including cross-origin stylesheets, with @import chains resolved) • Non-default computed styles — layout, typography, color, spacing • Resolved CSS custom properties (design tokens) • The element's outerHTML and inner text • A pixel-accurate screenshot, cropped to the element • Class list and likely Tailwind utilities, if present All captures are stored locally in your browser. A single "Copy" click produces a <web-capture>…</web-capture> payload that Claude's Design composer understands out of the box. WHY IT EXISTS Pasting a URL into an AI chat rarely gives it what it needs. Screenshots lose the styles. Copying HTML loses the visuals. WebGrabber captures both — plus the exact cascade of CSS that shaped the pixels — in one click. Claude then has enough context to redesign, clone, refactor, or explain. FEATURES • Shadow-DOM overlay that can't be broken by page CSS • Per-element screenshots cropped at the correct device pixel ratio • Cross-origin stylesheet fetch (host_permissions bypass the CORS wall that bookmarklets hit) • @import resolution so rules behind an import chain are included • Persistent capture list — survives tab reloads and navigations • Toolbar popup: copy, export JSON, clear • Keyboard shortcut Alt+Shift+C (rebind at chrome://extensions/shortcuts) • Badge counter showing how many captures are queued • Works on any site (captures restricted on chrome:// and Chrome Web Store pages by browser policy) PRIVACY Nothing leaves your machine. No analytics, no servers, no account. Captures live in chrome.storage.local and stay there until you clear them or export them. You paste manually. NOT AFFILIATED WITH ANTHROPIC This is an independent developer tool. "Claude" and "Claude Design" are product names referenced solely so you know where to paste the output. Built by an independent developer, not by Anthropic.

Details

  • Version
    1.0.0
  • Updated
    April 20, 2026
  • Size
    19.8KiB
  • Languages
    English
  • Developer
    Website
    Email
    hello@jens.marketing
  • Non-trader
    This developer has not identified itself as a trader. For consumers in the European Union, please note that consumer rights do not apply to contracts between you and this developer.

Privacy

Manage extensions and learn how they're being used in your organization
The developer has disclosed that it will not collect or use your data. To learn more, see the developer’s privacy policy.

This developer declares that your data is

  • Not being sold to third parties, outside of the approved use cases
  • Not being used or transferred for purposes that are unrelated to the item's core functionality
  • Not being used or transferred to determine creditworthiness or for lending purposes

Support

Related

Blueprint MCP for Chrome

5.0

Browser automation for Claude without token limits. Uses CSS selectors, not snapshots. Open source, zero telemetry.

Annotator - for Chrome

0.0

Capture page screenshot, annotate with draws/highlights/arrows/text, select & move elements, and send to IDE.

CSS Pully – Font & Color & Style Inspector

5.0

Font & CSS Detector - CSS Pully extracts colors, fonts, shadows, and styles from any webpage. Perfect for designers & developers.

Peek - Design & Asset Toolkit

4.8

Extract assets, colors, typography & tokens from any site. Export to CSS, SCSS, Tailwind & more. The ultimate dev & design toolkit.

Web Code Extractor – HTML, CSS & JavaScript Grabber

0.0

Extract HTML, CSS, and JavaScript from any webpage. Pick individual elements or grab the full page.

cssPicker - copy css from website

2.8

copy html and css from any website

SnipCSS

3.9

Extract the CSS/HTML for any element on any page, only take the styles you want

Screen Ruler - Measure and Inspect the Web

4.4

Web inspector for designers & developers. Measure elements, extract CSS & colors, capture screenshots & more.

CSS Scanly - Copy CSS | Tailwind & Bootstrap

5.0

Copy CSS properties from any web element with CSS Scanly. Supports Tailwind & Bootstrap, Helpful for developers and designers

CSS Pro Editor & Debugger

4.6

Visual CSS styling and debugging tool for developers.

Full Page Screenshot

4.0

Capture, annotate & design with backgrounds! All-in-one tool for full-page screenshots, edits & creative designs. Free & powerful.

UI Inspector - Visual CSS Editor

4.0

Inspect and visually edit elements and their CSS directly on the page for faster design and UI debugging.

Blueprint MCP for Chrome

5.0

Browser automation for Claude without token limits. Uses CSS selectors, not snapshots. Open source, zero telemetry.

Annotator - for Chrome

0.0

Capture page screenshot, annotate with draws/highlights/arrows/text, select & move elements, and send to IDE.

CSS Pully – Font & Color & Style Inspector

5.0

Font & CSS Detector - CSS Pully extracts colors, fonts, shadows, and styles from any webpage. Perfect for designers & developers.

Peek - Design & Asset Toolkit

4.8

Extract assets, colors, typography & tokens from any site. Export to CSS, SCSS, Tailwind & more. The ultimate dev & design toolkit.

Web Code Extractor – HTML, CSS & JavaScript Grabber

0.0

Extract HTML, CSS, and JavaScript from any webpage. Pick individual elements or grab the full page.

cssPicker - copy css from website

2.8

copy html and css from any website

SnipCSS

3.9

Extract the CSS/HTML for any element on any page, only take the styles you want

Screen Ruler - Measure and Inspect the Web

4.4

Web inspector for designers & developers. Measure elements, extract CSS & colors, capture screenshots & more.

Google apps