Specimen — Inspect & copy UI

Inspect any live site and copy UI — Tailwind, HTML, or CSS. Frame shots and save to Lab. Free. usespecimen.com

🔬 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.