Visual testing

Review a Site in Forced Colors Mode

Published by whatisADA / Grow Wild Agency · Updated

Purpose and preparation

Inspect a site with an operating system contrast theme or a documented forced-colors test setup. Check whether boundaries, selected states and focus remain visible when the browser substitutes system colors. Record the actual environment used.

A practical example

A selected pricing plan uses a background fill and an icon; the selection must remain understandable when that background is replaced.

How to check it

  1. Enable the contrast theme and reload the representative page. Inspect links, controls, focus indicators and important icons against the substituted background.
  2. Operate checkboxes, tabs, validation and dialogs. Verify that selected, checked, expanded and error states remain distinguishable without the original color palette.
  3. Inspect decorative and informative background images separately. Record controls that depend on box shadows or background fills and test a border or system-color treatment as a possible repair.

What can be missed

Forced-colors simulation does not reproduce every user theme. Disabling forced-color adjustment broadly can remove the user's chosen contrast and should not be the default repair.

Record your test

Use this worksheet to record what you actually checked. Notes stay on this device when you choose Save; they are not sent to us. Avoid personal or confidential information on shared devices.

These are your observations, not automated results or a conformance certificate. A complete evaluation needs appropriate scope, supported technologies, all applicable criteria and relevant page states.

Primary sources and scope

This is independent implementation guidance with original examples. The linked standard contains the full definitions, exceptions and conformance requirements. A criterion or checklist alone does not establish legal applicability or whole-site conformance.