GrabCSS

About

**GrabCSS** lets you visually select any element on any webpage and instantly extract its HTML and CSS — ready to copy and paste.

**How it works:**
Click the extension icon, hover over any element, and click to grab it. The code appears in a floating panel — one click to copy.

**3 output formats:**
• HTML + scoped CSS (clean class names, no noise)
• HTML with inline styles
• HTML with Tailwind CSS classes

**Smart extraction:**
• Captures real CSS rules from stylesheets, not just computed styles
• Resolves CSS variables so the output works standalone
• Grabs the full element tree with all sub-elements
• Captures animations and transitions
• Cleans up data attributes and placeholder images

**Keyboard shortcuts while picking:**
• Arrow Up/Down — navigate to parent or child elements
• Alt (hold) — switch between element and subtree mode
• Escape — cancel

**Built for developers and designers** who need to quickly grab a component from any site for prototyping, learning, or reference.

No data collection. No external requests. No account needed. Everything runs locally in your browser. 100% free.