← All ContrastRadar guides

Screenshot workflow

How to Check Text Contrast in a Screenshot on Mac

A practical screenshot-review workflow for locating rendered text, checking WCAG contrast, and deciding which results need manual verification.

Published Updated

Sometimes the only artifact available for review is a screenshot: a marketing page waiting for approval, a design export, or a capture from an application you do not control. You can see that some text feels faint, but there is no CSS inspector and no reliable foreground swatch to copy.

A screenshot check starts from the rendered pixels. ContrastRadar uses macOS text recognition to locate text regions, estimates the text and nearby background colors, and maps the findings back onto the image. That makes it useful for screening a visual handoff. It does not recover the original HTML, font metrics, or accessibility tree.

Run the check on the final-size capture

Open ContrastRadar and drop in a PNG, JPEG, or HEIC image, or use Choose Images. For a quick trial, the built-in sample contains both readable and low-contrast text. Recognition and color analysis run on the Mac; the selected image is not uploaded for processing.

Use a capture close to the size at which the interface will be reviewed. Resizing and compression change edge pixels, so a thumbnail downloaded from a chat thread may produce a different estimate from the original export. If the image is longer than 4096 pixels on either side, ContrastRadar downsamples it proportionally before analysis.

  • Start with WCAG when the question is whether ordinary text reaches the familiar AA reference threshold.
  • Choose Issues Only to reduce a long result list before reviewing individual regions.
  • Select a result in the list to locate its rectangle on the image, or select a rectangle to find the corresponding result.

Read the ratio in context

WCAG 2.2 Success Criterion 1.4.3 uses a minimum contrast ratio of 4.5:1 for normal text and 3:1 for large text. Those are thresholds, not values to round up to. ContrastRadar reports the estimated ratio, a weaker local estimate, and the share of sampled text area that reaches the reference threshold.

A screenshot does not reliably disclose CSS font size or weight. ContrastRadar therefore uses the normal-text threshold for its primary WCAG screening result. If you intend to rely on the large-text exception, confirm the actual size and weight in the source design or implementation rather than inferring them from pixels alone.

Use confidence as a review queue, not a verdict

OCR confidence and color-sampling confidence are combined for each result. High Confidence means the combined value is at least 0.78 in the current app. Medium- and low-confidence findings deserve a closer look because busy backgrounds, transparency, compression, or a loose OCR rectangle may have affected the color estimate.

The foreground and background swatches are evidence for that review. Compare them with the pixels under the highlighted region. If the sampled background clearly belongs to a nearby border or image detail rather than the area behind the glyphs, check the source manually instead of treating the number as final.

Know what the screenshot cannot prove

A rendered image can expose a likely contrast problem, but it cannot tell you whether text is a logo, decorative, hidden, disabled, or part of a control state that appears only on hover or focus. It also cannot test semantic structure, keyboard operation, text resizing, or reflow.

Use screenshot analysis to find places worth fixing before handoff. For formal web conformance work, verify the actual page, its states, and the applicable WCAG exceptions with source-aware accessibility tools.