Specter - Inspect any website like a design file

by•
Specter turns any webpage into something you can read like a design file. Hover any element to see its spacing, typography, colour, WCAG contrast, borders, and flex/grid layout — in plain, copyable CSS. Load your design tokens and it flags every off-token colour, size, and radius. Plus a live eyedropper with a zoom loupe, full-page screenshots, and :hover/:focus/:active simulation. 100% local, no tracking, free. Built for designers, UX engineers, and front-end devs.

Add a comment

Replies

Best
Maker
📌
Hey Product Hunt 👋 I'm Eni, a product designer. I got tired of opening DevTools just to answer "what's the padding here?" or "is this even our blue?" — so I built Specter: DevTools reimagined for designers. Hover any element and read its spacing, type, colour, WCAG contrast, and flex/grid layout in plain, copyable CSS. Load your design tokens and it flags anything off-system. It also has a live eyedropper (with a zoom loupe), full-page screenshots, and hover/focus/active simulation. Everything runs 100% locally — no accounts, no tracking — and it's free. Would love your feedback: what would make it a daily-driver for you?