Back to ContrastDuo

ContrastDuo Scan v2026.08.3

A bookmarklet that scans the whole page and lists text and icons that pass WCAG 2 AA but fall short of the contrast the ARC Silver reference table requires for their actual size and weight — including the :hover, :focus, :focus-visible, :active and :visited states declared in CSS. It evaluates everything as fluent content, ARC’s strictest criterion: a legal notice or a footer can appear in the list and still be right for its actual use. Each combination links to ContrastDuo, where it is interpreted.

When the measured size or weight is not in the table, the requirement is interpolated between the two rows (or columns) that bracket it. If the more demanding of the two is marked as not suitable, no interpolation happens: the other one’s requirement is taken as a minimum. In that case the exact number is not published, so Scan may leave out text whose real requirement is higher.

What it does (and does not do)

It is not a validator. It does not look for WCAG failures (Lighthouse, axe and WAVE already do that): it detects combinations worth reviewing — text that passes its applicable WCAG 2 AA threshold (4.5:1, or 3:1 for large text) but whose APCA Lc falls short of what the reference table asks for its actual size and weight, and monochrome SVG icons that meet the 3:1 of WCAG 1.4.11 but sit below |Lc| 45 (a provisional threshold: the ARC guidance for non-text elements is still in development). A combination appearing on the list does not mean it is an error: it means it deserves an informed look.

Whatever cannot be measured reliably (images, gradients, transparencies, filters…) stays off the list and is counted separately in the summary: no number is ever made up.

The table is not in absolute pixels. It is in pixels of a reference font: Helvetica Neue, Helvetica, Fira Sans, Kanit or Arial. Scan reads the computed font-size and looks the table up directly, without converting, so on pages set in any other typeface its verdicts carry a size bias. A font with a smaller x-height gives a smaller effective size than its font-size declares, and Scan evaluates it against a more permissive row than it should. ARC’s method for any other font is to compare its lowercase x-height against the reference and scale the size by that same proportion.

Install

ContrastDuo Scan v2026.08.3

Drag the link above to your bookmarks bar (if you can’t see it: Ctrl+Shift+B in Chrome and Edge). Then, on any page, select the bookmark to open the panel; select it again to close it.

Selecting the link here runs it on this very page, as a demo.

Install without dragging (keyboard)

1. Copy the code from the box below.
2. Create a new bookmark (Ctrl+D or from the bookmark manager) and edit it.
3. Paste the code as the bookmark’s URL and give it a name, for example “ContrastDuo Scan”.

Copy the code

How to use it

• Select “Scan the page”. The page scrolls by itself from top to bottom while measuring; progress shows in the panel and the Stop button stops the sweep and keeps what was already measured. Escape closes the panel at any time.
• The result is a list grouped by combination (colors, size and weight, or “SVG icon”) with the number of occurrences. Each occurrence is a button that scrolls to the element and highlights it, without moving keyboard focus.
• Combinations that only appear in a state carry its suffix: (:hover), (:focus), (:focus-visible), (:active) or (:visited). Activating one of these occurrences shows the element with its state genuinely applied (in addition to the highlight) until you jump to another one, re-scan, or close the panel.
• Each group carries a “More info about this combination on ContrastDuo” link that opens ContrastDuo with the colors (and the size and weight, for text) preloaded.
• With a screen reader: these are all standard buttons and links, reachable with Tab. The result is announced when the scan finishes; intermediate progress is visual only.

Known limitations

• The page scrolls during the scan (only what is on screen can be measured). When it finishes, the page returns to where it was.
• Some elements may go unmeasured: those inside carousels or horizontal scrollers, those a sticky header covers at the moment they would be measured, and those positioned off-screen. They are counted separately in the summary (“W of V candidates measured”).
• The icon threshold (|Lc| < 45 with 3:1 met) is provisional, pending the ARC guidance for non-text elements.
• The :hover/:focus/:focus-visible/:active/:visited states are assessed from the declared CSS rules: cross-origin stylesheets without CORS are not readable (the panel says so), color changes made with JavaScript are not detected, and :visited is assessed as declared (the browser hides the real state for privacy).
• On pages that load content as you scroll, whatever appears during the sweep is measured; anything appearing afterwards is not on the list (you can re-scan).

Privacy

The bookmarklet makes no network requests and sends no data anywhere: everything is computed inside the page. The “More info” links open ContrastDuo with the colors in the URL.

ContrastDuo Scan includes the APCA calculation from apca-w3 (W3C Limited License) by Andrew Somers / Myndex Research. The conformance values come from the ARC Silver table, published at apcacontrast.com. All other code © 2026 Mario Germán Almonte Moreno, MIT license.