Chrome / Edge extension

Inspect any website like a design system.

Kaes Keid reveals layout, typography, color, assets, performance signals, and stack fingerprints directly from the page you are viewing.

Stack90+ technology signals
DesignCSS, type, colors, assets
ReportsJSON and Markdown export
RuntimeLocal, no account required

What it does

One panel for product inspection.

Simple enough for quick checks, deep enough for design audits and implementation notes.

01Element

Read the selected UI.

Inspect box model, spacing, borders, shadows, filters, transitions, type, color, and contrast from hovered elements.

02Page

Extract the system.

Group color roles, typography patterns, image assets, SVGs, backgrounds, and layout structure into useful summaries.

03Stack

Detect the build.

Identify frontend frameworks, styling systems, analytics, CMS, infrastructure, services, and integrations from multiple signals.

Product preview

A compact inspector for real pages.

Use Stack for technology fingerprints, then switch tabs to inspect the visual layer. Export the current element, tab, or full scan when the evidence is ready.

StackCategory and cloud views with confidence and frequency.
TypeFont families, sizes, weights, samples, and hierarchy groups.
AssetsImages, SVGs, and backgrounds with direct download paths.
Kaes Keid Inspector main panel
Kaes Keid element inspection overlay Kaes Keid stack detection screen

Local install

Build it. Load it. Inspect.

The extension is free and open source. Build locally, load the `dist/` folder, and run it on Chrome or Edge.

Clone the repository

Get the source and move into the project folder.

git clone https://github.com/mafhper/kaes-keide-inspector.git
cd kaes-keide-inspector
Build the extension

Install dependencies with Bun and generate the browser bundle.

bun install
bun run build
Load unpacked

Open your browser extensions page and select the compiled folder.

chrome://extensions
Developer mode
Load unpacked: dist/