Everything about a website’s design in one panel
PikSpec is a website inspector for Chrome. Open it on any page and it reads the whole design at once: the color palette, the fonts and type scale, the spacing system, the corner radii and shadows. Then you can drill into any single element, collect the page’s media, and export what you learned.
What you can inspect
Styles: the page’s palette grouped by role, and every font family with its type scale.
Inspect: any element’s layout, spacing, typography and appearance, its anatomy and interactive states, with every CSS property searchable and copyable.
Media: the page’s images, SVGs, icons, videos and Lottie animations, ready to preview, copy or download.
Tokens: the design system as DESIGN.md, JSON, CSS, Tailwind and SCSS files.
Clone: a static copy of the page saved to your workspace, so you can study it later.
CSS inspector · Font finder · Color picker · Design system extractor
Tools for checking a layout
A ruler measures distances between elements on the page, and a responsive preview shows the site at phone and tablet sizes without leaving the panel. Together they help you understand how a layout is put together, not just what it looks like.
Who uses a website inspector
Designers use PikSpec to study references and understand why a site feels right. Developers use it to get exact values instead of guessing from screenshots. People building with AI tools use its exports to give Claude Code, Cursor, v0 or Lovable a real design spec, which is the difference between a generic layout and one with taste.
How to inspect a website
1. Install PikSpec from the Chrome Web Store and open any website.
2. Open PikSpec from the toolbar and choose Grant access & analyse.
3. Start in Styles for the overview, then open Inspect, Media, Tokens or Clone for detail.
Free to use
Inspecting styles and elements and collecting media are unlimited and free. Token exports, reconstruction prompts and page clones come with a free allowance, and one-time credit packs add more.
Use it on pages you are allowed to inspect
PikSpec works on normal web pages you open in Chrome. Chrome’s internal pages and the Chrome Web Store cannot be inspected. Studying a site’s design is fine; reusing its brand, content or licensed assets needs permission.
Contact PikSpec
Email support@pikspec.com for support, privacy requests or content reports.