Design & Accessibility
Locator Bar Color Contrast Checker is a free, browser-only WCAG contrast tool for the status and navigation bars in your interface: describe your locator bar in the primary input, pick a foreground and background color, and get an instant contrast ratio with AA and AAA verdicts for normal and large text. Adjust either color with the RGB sliders, watch the live locator bar preview update, then copy, download, or share the compliance report — no sign-up, no upload, and no server round trip. The live app keeps the tool first: enter details, generate a result, then copy, download, or share the output.
Type or paste a description of your locator bar into the primary input, or enter a foreground and background hex color directly, then run the checker. The tool computes the WCAG 2.x contrast ratio from the two colors in your browser and shows the result in the output panel: the ratio itself, the readability rating, and pass or fail badges for the AA and AAA thresholds at normal and large text sizes. Use the RGB sliders to fine-tune either color and watch the ratio recalculate, with the live preview rendering your bar exactly as configured. Copy, download, or share the report once the pair passes.
For WCAG 2.x AA compliance, normal text needs a 4.5:1 contrast ratio and large text (18px, or 14px bold) needs 3:1. AAA raises the bar to 7:1 for normal text and 4.5:1 for large text. A locator bar that fails these thresholds can make status text illegible for low-vision users, so the checker reports all four thresholds at once: AA normal, AA large, AAA normal, and AAA large. Ratios of 7:1 and above are labelled Exceptional Readability, 4.5:1 and above pass AA for normal text, and anything below 3:1 should be treated as a compliance risk before release.
Every check appears in the output panel with its ratio, verdicts, and the two colors that produced it. Copy places the full report on your clipboard, Download saves it as a timestamped text report, and Share copies a shareable reference to the tool itself. Nothing is uploaded: color parsing, relative luminance, contrast math, clipboard writes, and file downloads all run locally with deterministic JavaScript, so brand colors and internal design tokens never leave your device. Recent checks persist only in your browser through the local adapter and can be exported as JSON or CSV at any time.
Locator bars — the persistent status, navigation, or progress strip in an interface — carry small text that is easy to get wrong. Checking one pair of colors against every WCAG threshold manually is slow and error-prone; a focused contrast checker turns the job into one click. Because the tool runs entirely in the browser, there is no account, no color upload, no per-run cost, and no learning curve beyond entering the two colors.
A locator bar color contrast checker measures the WCAG contrast ratio between the foreground and background colors of a locator bar — the status or navigation strip in an interface. It reports the ratio and whether the pair passes AA and AAA thresholds for normal and large text.
Type or paste a description of your locator bar into the primary input, or enter a foreground and background hex color directly, then run the checker. Adjust the RGB sliders to fine-tune either color, read the ratio and badges in the results panel, and use the live preview to see the bar rendered with your colors. Copy, download, or share the report when it passes.
Yes. The tool is free to use and runs entirely in your browser. There are no uploads, no API keys, and no per-run charges, and your colors and descriptions never leave the page.
For WCAG 2.x AA compliance, normal text needs a 4.5:1 ratio and large text (18px, or 14px bold) needs 3:1; AAA raises the normal-text bar to 7:1. Ratios of 7:1 and above are considered exceptional readability and pass every common threshold.
The checker computes relative luminance from the sRGB channels of each color exactly as WCAG 2.x specifies, then divides the lighter luminance plus 0.05 by the darker luminance plus 0.05. The result is rounded to one decimal place, for example 12.3:1.