Launching today

Code Specimen

Launching today

Free CSS inspector, font finder and color picker for Chrome

2 followers

Free CSS inspector, font finder and color picker for Chrome

2 followers

Visit website

Interface design tools

•

Design resources

Code Specimen is a free CSS inspector, font finder and color picker for Chrome and Firefox. Click its icon on any website, point at a heading, button or card, and its fonts, colors, spacing and CSS open in the side panel beside the page, each with a copy button. It lists every typeface and color on the page, exports the palette as CSS variables, a Tailwind config or JSON, checks text contrast against WCAG AA, and downloads the page's images. No account, analytics or ads.

Free

Launch tags:Chrome Extensions•Design Tools•Developer Tools

Launch Team / Built With

Maker

📌

Hi Product Hunt! I'm Fredrick, the maker of Code Specimen. I work on websites every day as an SEO specialist, and I wanted one free CSS inspector that shows a page's fonts, colors, spacing and CSS in one place, without an account or tracking. So I built Code Specimen. Here's how it works: click its icon on any website, point at a heading, button or card, and its fonts, colors, spacing and CSS open in Chrome's side panel beside the page, each with a copy button. It also: • lists every typeface and color on the page • exports the palette as CSS variables, a Tailwind config or JSON • checks text contrast against WCAG AA • downloads the page's images It reads a page only after you click its icon, never asks for access to all your websites, and has no account, analytics or ads. It's free on Chrome and Firefox, works in Edge, Brave, Opera and Vivaldi through the Chrome Web Store, and comes in 20 languages. I'd love to hear which part you'd use most, and what you'd want it to inspect next.

Report

17d ago

Forum Threads

p/code-specimen

•

17d ago

Code Specimen, a free CSS inspector, launches 20 October. What should it inspect?

Hi everyone, I'm Fredrick, the maker of Code Specimen. It's a free CSS inspector, font finder and color picker for Chrome and Firefox, and it launches here on Tuesday 20 October.

Click its icon on any website, point at a heading, button or card, and its fonts, colors, spacing and CSS open in the side panel beside the page, each with a copy button. It also exports the palette as CSS variables, a Tailwind config or JSON, and checks text contrast against WCAG AA. There's no account, analytics or ads.

Before launch day I'd love your input. When you inspect a website, what do you look for first: the fonts, the colors or the spacing? And what does the tool you use today make harder than it should be?

You can try it now out
Chrome: https://chromewebstore.google.co...

View all