Webgrabber For Claude Des Chrome extension icon

Webgrabber For Claude Des

✨ AI-Powered
👥 122 users
📦 v1.0.0
💾 19.8KiB
📅 2026-04-20
View on Chrome Web Store

Chrome will indicate if you already have this installed.

Overview

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.

Tags

Productivity/developer screenshot design productivity/developer

Privacy Practices

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

🔐 Security Analysis

⏳ Security scan is queued. Check back soon.

Capture a screenshot of your current page in entirety and reliably—without requesting any extra permissions!
Productivity/developer AI
브라우저에서 라온시큐어의 PC보안 기능을 사용하기 위한 확장 프로그램입니다.
Productivity/developer
Adds React debugging tools to the Chrome Developer Tools. Created from revision 3cde211b0c on 10/20/2025.
Productivity/developer