A CSS inspector that respects your flow.
DevTools is a whole IDE. You just wanted a padding value. CSSpeek gets you the answer and gets out of the way.
The shape of the problem
Most CSS questions during a workday are quick ones. "What's the padding here?" "What class is this?" "Why is the font so small?" DevTools answers all of them — but the path is right-click, Inspect, scroll the tree, find the element, scroll the Computed panel, read, close. Eight steps for a three-second answer.
CSSpeek compresses that path to click the icon, click the element, read. Three steps for the same three-second answer. Multiplied across a day of UI work, it's a material productivity bump.
Concrete workflows
- Debug unexpected spacing in a staging build. Click the offending element. Read margin and padding. Cross-check against the design token. Fix. Total time: under a minute.
- Verify a Tailwind utility actually applied. Utility classes sometimes lose specificity battles. CSSpeek shows the computed values, so you can tell whether py-4 lost to an inherited rule.
- Read another team's component library. Before adopting a design system, scan its primitives in the browser: box model, typography, color tokens. CSSpeek gives you that read without opening DevTools.
- Write a precise bug report. Instead of 'the card looks wrong,' copy the selector, paste the measured padding, and file a ticket that engineering can reproduce in one read.
Where it shines
- Debugging layout shifts on your own site, in seconds
- Reading utility-first CSS on Tailwind or UnoCSS apps
- Spotting inherited typography you didn't expect
- Reviewing PRs in the browser without an IDE detour
- Pairing with QA on reproducing a pixel-level regression
For developers: frequently asked questions
- I already live in DevTools. Why would I add another tool?
- DevTools is an IDE. CSSpeek is a magnifying glass. The question is what the task needs. For quick reads, CSSpeek is three clicks faster. For deep debugging, DevTools still wins.
- Does CSSpeek work on localhost?
- Yes. It works on any URL Chrome can load, including http://localhost and IP-based internal tools.
- Can CSSpeek read CSS variables?
- CSSpeek shows computed values — the final resolved numbers — rather than the CSS custom property names. If you need to see --color-brand rather than its resolved hex, use Chrome DevTools.
- Does it affect performance of my dev server?
- No. CSSpeek only runs when you explicitly activate it on a tab. When inactive, the extension has zero impact on page load or rendering.