# Excerpts from WCAG20 Guideline 1.4 Distinguishable

I google for this and refer to it in conversation every now and then, so I
decided to attach the excerpts here.

> Guideline 1.4 Distinguishable: Make it easier for users to see and hear
> content including separating foreground from background.
>
> _Source: https://www.w3.org/TR/WCAG20/#visual-audio-contrast_

## Guidelines on color and contrast

> **1.4.1 Use of Color**
>
> Color is not used as the only visual means of conveying information,
> indicating an action, prompting a response, or distinguishing a visual
> element. (Level A)
>
> _Note:_ This success criterion addresses color perception specifically. Other
> forms of perception are covered in
> [Guideline 1.3](https://www.w3.org/TR/WCAG20/#content-structure-separation)
> including programmatic access to color and other visual presentation coding.

> **1.4.3 Contrast (Minimum)**
>
> The visual presentation of text and images of text has a contrast ratio of at
> least 4.5:1, except for the following: (Level AA)
>
> - 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.
> - Logotypes: Text that is part of a logo or brand name has no minimum contrast
>   requirement.

> **1.4.6 Contrast (Enhanced)**
>
> The visual presentation of text and images of text has a contrast ratio of at
> least 7:1, except for the following: (Level AAA)
>
> - Large Text: Large-scale text and images of large-scale text have a contrast
>   ratio of at least 4.5: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.
> - Logotypes: Text that is part of a logo or brand name has no minimum contrast
>   requirement.

> **1.4.8 Visual Presentation**
>
> Visual Presentation: For the visual presentation of blocks of text, a
> mechanism is available to achieve the following: (Level AAA)
>
> 1. Foreground and background colors can be selected by the user.
> 2. Width is no more than 80 characters or glyphs (40 if CJK).
> 3. Text is not justified (aligned to both the left and the right margins).
> 4. Line spacing (leading) is at least space-and-a-half within paragraphs, and
>    paragraph spacing is at least 1.5 times larger than the line spacing
> 5. Text can be resized without assistive technology up to 200 percent in a way
>    that does not require the user to scroll horizontally to read a line of
>    text on a full-screen window.

<style>{`
  blockquote p, blockquote li {
    font: 400 1rem Inter;
  }
`}</style>
