Inspect any live site and copy UI — Tailwind, HTML, or CSS. Frame shots and save to Lab. Free. usespecimen.com
Users
6
store count
Rating
0.0 / 5
unchanged in 30 days
Ratings
0
total ratings
Store rank
#242K
#203K among extensions
Version
0.9.16
updated 5 Oct 2026
About Specimen — Inspect & copy UI
🔬 Export web to code in one click. Web element inspector & font finder: grab CSS, fonts, colors, SVGs & design DNA. Frame product shots. Save to Lab. No DevTools.
Specimen is a web element inspector, font finder, asset harvester, and web-to-code tool in one. Inspect any website, extract its colors, fonts, components, and assets, copy clean code, frame polished product shots, and save design specimens to your cloud Lab — all without opening DevTools.
What you can do:
🔍 Inspect & copy live
Hover any element to see its styles. Click to open Inspect with a live preview, walk parents and children, and copy Tailwind, HTML + CSS, React (JSX), Vue, or CSS-only — with the site’s fonts and styles included.
📋 Click to copy any value
Grab a hex color, a font family, spacing, radius, or shadow from Overview and Inspect. One click, on your clipboard.
🧩 Export to code
Select any element or section and export as Tailwind, HTML + CSS, React (JSX), Vue, or CSS. Defaults to Tailwind so what you paste matches modern stacks.
🎨 Capture the design system
Overview gives you the site’s full color palette, font stack, media, SVGs, and detected tech stack at a glance — design DNA without digging through DevTools.
🖼 Frame product shots
Shot Studio lets you crop, pad, zoom, and place captures on desktop wallpaper scenes for product-ready PNGs — perfect for decks, listings, and marketing.
📥 Download assets
Pull images, SVGs, colors, and fonts directly from any website. No more right-click-save-as scavenger hunts.
♿ Accessibility checker
Built-in WCAG contrast analysis on text colors across the page you’re scanning.
📝 Design MD for AI agents
Export a site brief you can drop into Cursor, Claude, or your coding agent — colors, type, and structure ready for prompts.
🧪 Specimen Lab
Paste, drop, or Save from Inspect. Optional sign-in syncs your gallery to Specimen Lab at usespecimen.com so your collection travels with you.
🌙 Side panel + light & dark
Use Specimen in the Chrome side panel, with light or dark themes that stay out of your way while you work.
Who uses Specimen:
• Web designers collecting color palettes, font combinations, and visual references
• Frontend developers grabbing CSS values, inspecting layouts, and extracting assets
• Product teams framing polished UI shots for docs, pitches, and Chrome listings
• UX designers checking contrast and design DNA across live pages
• Agencies analyzing competitor sites and gathering client brand assets
How it works:
Open Specimen from the Chrome side panel and browse any website. Colors, fonts, images, and assets surface in Overview. Turn on Inspect, hover and click any element for a full CSS breakdown and live preview. Copy or download with one click. Save keepers to Lab.
No DevTools needed. Just hover, click, and copy.
Free to use — inspect any element, see any site’s colors, fonts, and stack, harvest assets, frame shots in Shot Studio, and save to Lab.
Learn more at usespecimen.com
Help: usespecimen.com/help
Specimen is a web element inspector, font finder, and web-to-code tool in one. Use it as a font finder to identify typefaces, a web element inspector to read any element’s CSS, and a web-to-code exporter to turn live UI into Tailwind, HTML, React, or Vue. Download SVGs and images from any site. Frame product shots. Keep a Specimens Lab.