Contrast ratio

• Follow the WCAG principles.

  According to WCAG principles (Web Content Accessibility Guidelines), the visual presentation of text and images of text has a contrast ratio of at least 4.5:1 (contrast ratio between text and background behind the text), except for the following:

  Large text: Large-scale text and images of large-scale text have a contrast ratio of at least 3:1.

  Incidental: Text or images of text that are part of an inactive user interface component, that are pure decoration, that are not visible to anyone, or that are part of a picture that contains significant other visual content, have no contrast requirement.

• Use the contrast checker to check the text contrast.

  Contrast checker: Color contrast checker & ratio calculator.