Inspect any element in four clicks.
CSSpeek is designed to stay out of your way. Install once and it lives in your toolbar, ready whenever you need it — no learning curve, no settings to configure.
Install from the Chrome Web Store
One click adds CSSpeek to Chrome or any Chromium-based browser (Edge, Brave, Arc). No account, no setup wizard, no permissions that make you nervous.
Pin the extension to your toolbar
Click the puzzle icon in Chrome's toolbar, find CSSpeek, and pin it so it's always one tap away. This step is optional but saves seconds every time.
Activate the inspector
Click the CSSpeek icon on any page. The inspector turns on — hover shows element outlines, click locks the selection.
Read and copy what you need
The CSSpeek panel opens with the element's selector, box model, typography, colors, and display mode. Click any value to copy it.
What you'll see in the panel
When you click an element with the inspector active, CSSpeek opens a focused panel showing the ten properties you're most likely reaching for:
- Selector
- The clicked element's classes, IDs, and a generated selector path.
- Box model
- Content width and height, plus padding and margin drawn in the classic diagram.
- Typography
- Font family (declared and resolved), font size, line-height, text-align, color.
- Color & background
- Color values with swatches, backgrounds including gradients.
- Display
- Display mode, position, box-sizing.
Tips that make CSSpeek faster
- Use the keyboard shortcut (configurable in chrome://extensions/shortcuts) to toggle the inspector without moving your hands.
- Click an element, then press Escape to dismiss the panel without deactivating the inspector — handy for rapid comparison across elements.
- CSSpeek remembers its last panel position, so it stays out of the area you care about between sessions.
- On mobile-emulated devices, CSSpeek respects the emulated viewport when reporting computed values.
If something doesn't work
Most first-time issues are about pinning (CSSpeek's icon is hidden behind the puzzle menu until you pin it) or about Chrome pages that block all extensions. See the support page for troubleshooting.
How it works: frequently asked questions
- How long does installation take?
- About ten seconds. Install from the Chrome Web Store, pin the icon, and you're done. No onboarding, no tutorial, no dark patterns.
- Do I need to restart my browser?
- No. CSSpeek is available immediately on any tab you load or refresh after install.
- Can I use CSSpeek alongside other CSS tools?
- Yes. CSSpeek coexists happily with Chrome DevTools and other inspection extensions. It doesn't modify the page's styles, so there's no conflict.
- Does it work on local development servers?
- Yes. CSSpeek works on http://localhost and any internal domain — you don't need HTTPS or a public URL.
- What happens when I close the tab?
- Nothing persists beyond your local extension preferences. CSSpeek doesn't track sessions or log which elements you inspect.