Serifio: Font & Colour Inspector

Identify fonts, copy colour codes and check WCAG contrast ratios. The essential tool for designers and developers.

Peek under the hood of any website with Serifio, a free Chrome extension that makes font inspection, color extraction and typography analysis fast, simple and accurate. Perfect for web designers, front-end developers, UI/UX professionals, design system maintainers and educators/content creators. —————————————————————————— KEY FEATURES • Font detection: Identify font family, size, line height, spacing and weight; incl. inside Shadow DOM & component frameworks • Font verification: An indicator dot shows whether the intended font loaded (green) or a fallback is in use (yellow) • Color extraction: One-click copy of text and background colors as HEX; resolves rgb(), hsl(), oklch(), lab() and named colors • WCAG contrast checker: Automatic AA/AAA ratio with clear pass/fail, correctly accounting for transparency and text size • User-friendly: Fully keyboard navigable, remembers panel position per site, minimal impact on page load PRIVACY FIRST Serifio runs locally in your browser. No data is collected, no tracking pixels and no external servers. Your design research stays private. —————————————————————————— RELEASE NOTES v6.5.3: Fixed contrast accuracy & typing interruptions v.6.5.2: Fixed semi-transparent colour detection v.6.5.0: Fixed form controls & dark mode v6.4.2: Stability tweaks & minor bug fixes v6.4.1: Improved reliability & performance >> Thanks for your feedback Matthew McClelland v6.3.2: Stability tweaks & minor bug fixes v6.2.4: Added font verification >> Thanks for your feedback Stephen Harvey v5.8.8: Stability tweaks & minor bug fixes >> Happy (text inspecting) new year! v5.8.1: Added bi-directional collapse v5.3.1: Added support for P3 colour space v5.1.6: Added support for Google Workspace v5.1.4: Added support for shadowDOM v5.0.0: Proof of concept