Comparisons

What each tool in this category costs, what it is genuinely good at, and when the free option covers the job. We make one of them, which is stated on every page, and every price is quoted from the other product's own site with the date it was read.

The free alternative to every paid CSS inspector below is Verbatim: a Chrome extension that copies the CSS which actually applied to an element, with its hover states, media queries and design tokens, at no cost and with no account. The paid tools are faster for a quick look at one property; Verbatim is built for rebuilding a component, or for handing one to a coding agent.

At a glance

Price of each CSS inspector compared with Verbatim
ToolWhat it costsThe short version
CSS ScanLifetime licence, 120 USD list, discounted to 69 USD at the time of writingA free alternative to a 120 USD lifetime licence, and an honest note on when to buy theirs.
DivMagicLifetime 345 USD list, discounted to 200 USD at the time of writing. Also 16 USD a month, or 96 USD a yearFree against 345 USD lifetime or 16 USD a month, compared honestly.
CSS PeeperFree tier with limited features. Pro from 2.49 USD a month billed yearly, Ultra from 4.99 USD a month billed yearly, at the time of writingFree at full capability, against a free tier with features held back.
VerbatimFree forever, no account. MCP server for coding agents, 29 USD onceEvery rule that matched, states and breakpoints kept, as CSS, Tailwind or a framework component.

Prices read from each product’s own site on 16 September 2026. They change; follow the links before you buy.

Each comparison in full

How these comparisons are written

We make Verbatim, so these pages are not neutral, and each one says so at the top. What keeps them useful is that every price and every claim about the other product is quoted from that product’s own site with the date it was read, where a feature is not documented the table says not stated rather than guessing, and every page has a section on when the other tool is the better buy.

Questions about choosing a CSS inspector

What is the best free CSS inspector for Chrome?

For copying a component you intend to rebuild, Verbatim: it is free with no account and copies every rule that matched, including hover and focus states, media queries and the custom property names behind the values. For reading one property quickly, the browser’s own DevTools is free and already installed.

Why not just use DevTools?

DevTools shows the computed result, after the cascade has resolved. That discards the hover and focus rules, the media queries that do not apply at your current width, and the token names behind the values, which are exactly the parts you need to rebuild a component rather than take a snapshot of one.

Is a lifetime licence better value than a subscription?

If you open the tool most days, usually yes. If you need it a few times a year, a free tool or a single month of a subscription costs less. Each comparison lists the current price and the billing terms quoted from the vendor.

Can these tools export Tailwind or React?

Some can. Verbatim exports Tailwind v3 or v4 with the theme values the classes depend on, and React, Vue, Svelte, Astro or Angular components in JavaScript or TypeScript. Each comparison page says what the other tool documents.

Which of these work with Cursor or Claude Code?

Verbatim has an MCP server, so a coding agent such as Cursor, Claude Code or Windsurf can read a page itself, or receive an element you picked in your own browser. The MCP server is the only paid part, 29 USD once.

If you would rather read about the job than the tools

How to copy CSS from a website covers the four methods and what each one loses, and all thirteen tools have a page each.