UI Screenshot Analyzer

Upload a screenshot of an app or website to see its colour palette, the likely role of each colour and WCAG 2.2 contrast checks, all analysed in your browser.

The interactive tool loads here when JavaScript is enabled. Files are processed locally in your browser.

How to use UI Screenshot Analyzer

Upload a UI screenshot (JPG, PNG or WebP).
Review the detected palette and the suggested role of each colour, such as background, text or accent.
Check the contrast results and apply the suggestions to your design.

Features

Palette extraction tuned for interface screenshots.
Explainable role suggestions for backgrounds, surfaces, text and accents.
Deterministic WCAG 2.2 contrast checks for likely text and background pairs.
Runs locally without sending screenshots anywhere.

Supported formats and limitations

Input: JPG, PNG or WebP screenshot. Output: on-screen palette, roles and contrast results.

Gradients and photos inside the UI can add extra colours to the palette.

Frequently asked questions

How accurate are the colour roles?

They are suggestions based on how much area a colour covers and where it appears. Confirm them against your design.

Which contrast standard is used?

WCAG 2.2 contrast ratios, with AA and AAA thresholds for normal and large text.

Is the screenshot uploaded?

No. Analysis happens in your browser.