Color Audit

Color Audit scans a website's colors, groups the near-duplicates, and checks the foreground and background pairs it uses against WCAG 2.2 contrast thresholds. It runs at vesperapps.com/colors/color-audit.

Two ways to scan

• Scan a URL - paste a page address and Color Audit fetches that page's stylesheets and analyzes them. Some sites block automated requests or load their styles from another domain; if a scan comes back empty, use Paste CSS instead.
• Paste CSS - paste raw CSS directly. The analysis runs entirely in your browser - nothing is sent anywhere.

Reading the report

• Summary - unique colors, near-duplicate clusters, how many colors remain after collapsing the duplicates, and the number of contrast-failing pairs.
• Contrast findings - the foreground/background pairs declared on the same rule that fall below the WCAG AA threshold (4.5:1 for normal text, 3:1 for large text), ranked by how many rules use each pair. This is the part other color tools skip.
• Palette overview - every color, sorted by hue and weighted by how often it appears, each with an automatic color name.
• Near-duplicate clusters - colors within a small perceptual distance of each other, almost always accidental drift, with a single suggested color to collapse each cluster to.
• Open in Vesper Colors - a link that opens the palette in the Vesper Colors viewer to share, preview, or test further.

What it reads, and what it can't

Color Audit reads a site's authored CSS - the same static-analysis approach a CSS analyzer uses - not the fully rendered page. Colors applied by JavaScript or images, or a background inherited from a parent element, can therefore be missed. When it can't resolve both sides of a pair (for example, a semi-transparent background whose final color depends on what is behind it), it skips that pair rather than guessing. Treat Color Audit as a fast first pass. For a full WCAG audit of a live site, use Vesper Audit.

Privacy

Paste-CSS analysis happens entirely in your browser. The Scan-a-URL option fetches the target page's stylesheets through a Vesper serverless function - this works around the browser's cross-origin restrictions - and returns the CSS to your browser for analysis. The page content and your results are not stored.