Hover any element, copy its CSS as CSS, Tailwind, JSX, styled-components, Vue or Svelte. 100% local. Zero data collection.
Users
23
+4 in 30 days
Rating
5.0 / 5
unchanged in 30 days
Ratings
2
0 in 30 days
Store rank
#143K
#119K among extensions
Version
1.4.0
updated 2 Aug 2026
Users
monthly, 3 months
Latest, 16 Oct 2026:23 usersMove the mouse over the chart for any month
Ratings count
monthly, 3 months
Latest, 16 Oct 2026:2 ratingsMove the mouse over the chart for any month
The Chrome Web Store rounds user counts down to the leading digit, so the user line moves in steps. The ratings count is exact and is the better signal of real adoption.
About StyleGrab — Inspect & Copy CSS
Hover any element on any website and see its real, authored CSS instantly — pseudo-classes, media queries, keyframes and all. Copy it in one click as clean CSS, Tailwind, React/JSX, styled-components, Vue, or Svelte.
WHY STYLEGRAB
DevTools shows you one rule at a time and makes you reassemble the cascade by hand. StyleGrab merges everything that actually applies to an element — :hover states, breakpoints, animations — into one paste-ready block, in the format your project uses.
FREE, FOREVER
• Hover-inspect any element, instantly
• Copy full CSS — pseudo-classes, media queries, keyframes included
• Box-model overlay with live measurements
• Layout outliner — outline every element at once, colored by tag or by nesting depth (classic CSS layout debugging), with a color key, per-family filtering, and a hover bar that shows any element's selector + size
• Color eyedropper
PRO ($29 once, lifetime updates, 7-day free trial)
• Tailwind, JSX, styled-components, Vue, and Svelte export
• Copy an element + all its children as portable HTML + CSS
• One-click CodePen export
• Live CSS editing with real-time preview on the page
• Visual tune panel — adjust size, colors, spacing and radius with controls, then copy the CSS (no edit meters, no monthly caps)
• Font inspector — every family used on the page with weights, sizes and usage counts
• Element screenshot — copy any element as a PNG
• WCAG contrast checker
• Page color palette (with usage counts, copy as CSS variables) and image/SVG asset extraction
BUILT DIFFERENTLY
• var(--tokens) resolve to real values, so pasted CSS doesn't break
• Inherited typography folds in, so pasted snippets look right anywhere
• Every rule keeps a comment naming which stylesheet it came from
• Works on any framework — React, Vue, plain HTML, whatever the site is built with
PRIVACY, ACTUALLY
StyleGrab requests activeTab only — not "read and change all your data on all websites." It injects only into the tab you explicitly click it on, makes zero network requests during normal use, and collects nothing: no analytics, no accounts, no telemetry. The only third-party contact happens if you buy Pro: activating a license key calls Dodo Payments' license API to validate it — that's it.
Free forever tier included. No account required for either tier.