Everything you need to understand any website

Inspect CSS, annotate pages, collaborate live, extract colors, fonts and assets—all from one lightweight browser extension built for developers, designers, and agencies.

Install it once. Use it everywhere.

Add Sparrow to your browser

Install the extension in seconds and pin it to your toolbar. You can start inspecting right away no setup, no configuration.

Open it on any webpage

Click the Sparrow icon on any site production, staging, or localhost and the full toolkit appears as an overlay.

Inspect, annotate & measure

Switch between Inspect, Annotate, Ruler, Colors, Fonts, and Assets from one rail. Everything happens, so you never lose context.

Features

Inspect any element.
Understand every style.

Hover over anything on a page and Sparrow shows you the CSS that actually shaped it the full css, DevTools-style, with overridden rules struck through and the winning declaration on top. If the site uses Tailwind, Sparrow detects it and shows the utility classes separately, ready to copy.

  • The real CSS, media queries, states, and pseudo-elements included
  • Tailwind classes detected and copyable in one click
  • Dimensions, font, and colors summarized at a glance
  • Copy clean, ready-to-paste CSS for any element
  • Freeze any selection and browse its full DOM path
  • Multiple color formats

Feedback that lives
on the page.

Drop a numbered pin on the exact element you're talking about, write your comment, and share one link. Everyone who opens it sees your notes in context and can reply, resolve, and collaborate live, cursors and all.

  • Pin comments to exact elements no screenshots needed
  • Threaded replies with Open / Resolved statuses
  • One share link puts your whole team on the same page
  • Live collabrations show who’s reviewing what
  • Client mode lets reviewers comment without touching your notes

Measure spacing
to the pixel.

Click any element to anchor it, then hover anywhere else Sparrow draws the exact distance between them, with alignment guides projected across the whole viewport so misaligned layouts have nowhere to hide.

  • Measure the gap between any two elements
  • Alignment guides reveal what lines up — and what doesn’t
  • Visual QA without opening a design file

Discover every color,
Rebrand any website in seconds.

Sparrow scans the entire page and lists every color it paints, sorted by how much it's used. Click one to highlight everywhere it appears or swap it site wide to preview a rebrand in seconds. Copy any value as HEX, RGBA, or HSL.

  • The full palette with usage percentages and element counts
  • Highlight every element using a given color
  • Recolor the whole site live, then reset with one click
  • Copy values in HEX, RGBA, or HSL

Try any font
on a live website.

Audit every typeface a page uses, then preview a replacement instantly pick from about 1,900 Google Fonts or upload your own brand font. Swap the whole site or a single element; sizes, weights, and spacing stay exactly as they were.

  • Every font on the page, with usage stats
  • Search the full Google Fonts catalog with live previews
  • Upload your own .ttf, .otf, .woff, or .woff2. it never leaves your browser
  • Swap site-wide or one element at a time, and reset anytime

Every asset,
Ready to download.

Sparrow finds every image, SVG, and video a page uses including background images, favicons, and inline SVG that right click can't save. Download a single asset, or grab everything at once as a ZIP.

  • Finds images, SVGs, and videos even in CSS backgrounds
  • Filter by type, see dimensions and usage counts
  • Download one file or the whole page as a ZIP

Design review without the screenshot circus.

Send your client one link instead of asking them to describe a bug over email. They click the element, write what's wrong, and you get feedback pinned to the exact spot on the exact page with element context attached, ready to act on or hand to your team.

Comments with coordinates

Every note is anchored to a real element on the real page. No more 'the button on the left, no, the other left' the pin is the location.

Safe for clients, structured for you

Reviewers join in Client Mode: they can comment, reply, and mark items resolved, but they can't edit or delete your work. You keep a searchable review list with open/resolved counts.

Works where your work lives

Production sites, staging environments, localhost previews. Sparrow runs on all of them without touching your code or your deploy pipeline.

One toolkit, four jobs done.

Sparrow replaces a handful of single-purpose extensions with one overlay that stays out of your way.

Frontend developers

Debug styles faster than DevTools for everyday questions: what's this font, why is this margin off, which rule wins? Copy the CSS or Tailwind classes and get back to your editor.

Designers

Reverse-engineer interfaces you admire. Extract the palette with real usage data, identify every typeface, test your own fonts on a live page, and pull assets for your moodboard.

Agencies & freelancers

Turn client feedback from vague emails into pinned, threaded, resolvable comments on the live site. Share one link, watch the review happen in real time, and close items as you ship.

QA & product teams

Report visual bugs where they happen. Measure spacing against spec, flag misalignments with the ruler, and file annotations your developers can find without a repro guide.

Start free. Upgrade when it pays for itself.

Free

Everything you need to start inspecting.

$0free forever

What's Included

  • Full CSS inspector with cascade view
  • Ruler with alignment guides
  • 3 annotations per site per day
  • Website color overview

Pro

The complete toolkit for daily design work.

What's Included

  • Everything in Free
  • 10 annotations per site per day
  • Multiple color format toggle
  • Site-wide color swapping
  • Font testing Google Fonts + your own uploads
  • Asset downloads, single or ZIP
  • Multiple color formats support
  • Priority support

Max

No limits, for teams that review every day.

What's Included

  • Everything in Pro
  • Unlimited annotations
  • Unlimited client review links
  • Priority support

Questions? Answered.

Sparrow is a browser extension that overlays a design toolkit on any webpage. You can inspect the CSS behind any element, measure spacing, extract colors, fonts, and assets, and pin feedback directly on the live page all without opening DevTools or taking a single screenshot.

No. Designers and clients use Sparrow without writing any code hovering shows you fonts, colors, and sizes in plain terms, and leaving feedback is just click and type. Developers get the deeper layers too: the full CSS cascade, Tailwind class detection, and copy-ready code.

Yes, and it doesn't expire. Free includes the full CSS inspector, the ruler, the website color overview, and 3 annotations per site per day. Paid plans add site-wide color and font swapping, asset downloads, color format switching, and higher annotation limits.

Pro is $9/month ($90/year) and unlocks site-wide color and font swapping, asset downloads, color format switching, and 10 annotations per site per day. Max is $19/month ($190/year) and adds unlimited annotations and unlimited client review links. Paying yearly works out to two months free versus monthly.

Yes. You can switch between Free, Pro, and Max whenever you like, and manage everything — invoices, payment methods, cancellations — from your account portal. If you cancel, you keep your paid features until the end of the billing period you've already paid for, then drop back to Free automatically.

Annotation limits are per site and reset every 24 hours (3 a day on Free, 10 on Pro, unlimited on Max). Reaching the limit only pauses adding new pins on that site for the day, your existing annotations are always saved and stay fully editable and shareable.

Never. Everything Sparrow does — including recoloring a page or swapping its fonts is a local preview that only you see. The real website is untouched, and one click resets any experiment.

Pin your comments, click Share, and send the link. Anyone who opens it sees your annotations in place on the page and can reply or resolve items with live cursors when you're reviewing together. Share links expire after 3 days for safety, but your annotations are saved and you can mint a fresh link anytime.

No. People who join through your link enter Client Mode: they can comment, reply, and change an item's status, but they can't edit or delete your notes.

Any page your browser can open: live production sites, staging environments, and localhost. There's nothing to install on the website itself.

Yes, When an element is styled with Tailwind utilities, Sparrow shows the class list separately from the rest of the CSS and lets you copy the classes in one click.

Yes, uploaded fonts are registered directly in your browser and are never sent to a server. They apply for your current session only.

Stop guessing what's on the page. Start knowing.