Skip to content

About theme color contrast

This page explains why MapleGather checks the colors in your theme for readability, what the contrast warning means, and what happens when you choose to save a color anyway.

Color contrast is how easy text is to read against the color behind it. When you change your theme’s colors, MapleGather checks the contrast as you type and shows you the result right away. If a color is too hard to read, you get a warning — and MapleGather asks you to confirm before it saves that color. Your confirmation is recorded, so an inaccessible choice is always a deliberate one, never a surprise.

Every ready-made theme starts out easy to read: the built-in themes pass the strongest readability standard (called AAA) for body text before you change a thing. When you customize your colors, MapleGather makes sure your changes stay readable too.

Here’s what happens as you pick a color:

  • MapleGather measures the contrast. It compares your color against the background it will sit on and works out a contrast ratio — a number like 7.2 to 1. A higher number means easier to read. The check runs right in your browser, so the meter updates the instant you change the color, with no waiting.
  • The meter shows you a band. Just below your color you’ll see one of three results, always in words, not color alone:
    • Passes AAA — the strongest level. Comfortable for everyone.
    • Passes AA — consider AAA — meets the required floor, with a gentle nudge to aim higher for body text.
    • Below AA — the color falls under the readability floor. This is the one that triggers a warning.
  • A failing color has to be confirmed. The required floor for body text is a ratio of 4.5 to 1. If your color is below it, a warning appears under the color. When you try to save, MapleGather opens a message that names the exact ratio and gives you two choices: go back and pick a more readable color, or save the color anyway because it’s essential to your brand.
  • Saving anyway is recorded. If you confirm, MapleGather saves your color and writes an entry to your organization’s audit log — who made the change and when. The override is on the record, not hidden.

For the steps to change your colors, see Choose and customize your theme.

Low-contrast text is a real barrier. Readers with low vision, older members, and anyone reading on a phone in bright sunlight can find pale-on-pale text impossible to make out. MapleGather commits to the WCAG 2.1 AA accessibility standard, and the contrast check is how the theme editor keeps that promise for you — it builds readability in rather than hoping you’ll remember to test it.

The override exists because a brand color is sometimes non-negotiable, and you know your organization best. The point isn’t to block you — it’s to make sure the choice is deliberate and traceable. That way an inaccessible color is a decision on the record, not an accident nobody noticed until a member complained.

  • Passing AA is not the same as AAA. The “consider AAA” note is a suggestion, not a warning — you can save without doing anything about it.
  • The check covers your theme colors, not your whole site. It measures your chosen colors against their expected backgrounds. It isn’t a full audit of every image or embedded block on every page.
  • Dark mode is checked too. The colors in your dark variant get the same contrast check as your light theme.
  • The confirmation is per save. If you later switch to a color that passes, you won’t be asked to confirm anything.
  • MapleGather checks again when it saves. As a safety net, the server re-checks the contrast on save. In the rare case its result differs from your browser’s, you’ll see the same confirmation message before the color is saved.