Contrast tools

#36649d
|
rgb(54, 100, 157)
Contrast value

11.26 Lc

#4e82c2
|
rgb(78, 130, 194)
Sample text
Share these colors

APCA and WCAG 3.0

The Advanced Perception of Color Algorithm (APCA) considers the context in which colors are used to determine their readability. Font size, font weight, and the sequence of background and text colors all impact the recommended contrast value (Lc) for text.

APCA was included in previous working drafts of the WCAG 3.0 text contrast guidelines . However, the W3C Editor's Draft of WCAG 3.0 from June 2nd, 2023 reverted all guidelines to "Placeholder" status and removed prior guideline content, including text contrast and APCA.

The proposed WCAG 3.0 ratings for text contrast were based on the proximity of a calculated contrast value to its target score on the APCA Lookup Table below.

Although APCA’s eventual role in WCAG 3.0 is unclear, the APCA Readability Criterion (ARC) is developing as an independent standard for visual contrast. You can learn more in the ARC public working draft .

APCA Lookup Table

Font weight
100200300400500600700800900
12px
X
X
X
©
©
©
©
X
X
14px
X
X
©
100P
    100P
      90P
        75P
          X
          X
          15px
          X
          X
          ©
          100P
            90P
              75P
                70+
                  X
                  X
                  16px
                  X
                  X
                  ©
                  90P
                    75P
                      70+
                        60+
                          60
                            X
                            18px
                            X
                            ©
                            100P
                              75P
                                70+
                                  60+
                                    55+
                                      55
                                        55
                                          21px
                                          X
                                          ©
                                          90P
                                            70P
                                              60+
                                                55+
                                                  50+
                                                    50
                                                      50
                                                        24px
                                                        X
                                                        ©
                                                        75P
                                                          60+
                                                            55+
                                                              50+
                                                                45+
                                                                  45
                                                                    45
                                                                      28px
                                                                      X
                                                                      100
                                                                        70+
                                                                          55+
                                                                            50+
                                                                              45+
                                                                                43+
                                                                                  43
                                                                                    43
                                                                                      32px
                                                                                      X
                                                                                      90
                                                                                        65+
                                                                                          50+
                                                                                            45+
                                                                                              43+
                                                                                                40+
                                                                                                  40
                                                                                                    40
                                                                                                      36px
                                                                                                      X
                                                                                                      75
                                                                                                        60+
                                                                                                          45+
                                                                                                            43+
                                                                                                              40+
                                                                                                                38+
                                                                                                                  38
                                                                                                                    38
                                                                                                                      42px
                                                                                                                      100
                                                                                                                        70
                                                                                                                          55
                                                                                                                            43
                                                                                                                              40
                                                                                                                                38
                                                                                                                                  35
                                                                                                                                    35
                                                                                                                                      35
                                                                                                                                        48px
                                                                                                                                        90
                                                                                                                                          60
                                                                                                                                            50
                                                                                                                                              40
                                                                                                                                                38
                                                                                                                                                  35
                                                                                                                                                    33
                                                                                                                                                      33
                                                                                                                                                        33
                                                                                                                                                          60px
                                                                                                                                                          75
                                                                                                                                                            55
                                                                                                                                                              45
                                                                                                                                                                38
                                                                                                                                                                  35
                                                                                                                                                                    33
                                                                                                                                                                      30
                                                                                                                                                                        30
                                                                                                                                                                          30
                                                                                                                                                                            72px
                                                                                                                                                                            60
                                                                                                                                                                              50
                                                                                                                                                                                40
                                                                                                                                                                                  35
                                                                                                                                                                                    33
                                                                                                                                                                                      30
                                                                                                                                                                                        30
                                                                                                                                                                                          30
                                                                                                                                                                                            30
                                                                                                                                                                                              96px
                                                                                                                                                                                              50
                                                                                                                                                                                                45
                                                                                                                                                                                                  35
                                                                                                                                                                                                    33
                                                                                                                                                                                                      30
                                                                                                                                                                                                        30
                                                                                                                                                                                                          30
                                                                                                                                                                                                            30
                                                                                                                                                                                                              30

                                                                                                                                                                                                                Table key

                                                                                                                                                                                                                • N
                                                                                                                                                                                                                  WCAG 3.0 Rating 4 - meets or exceeds the values on the APCA Lookup table
                                                                                                                                                                                                                • N
                                                                                                                                                                                                                  Rating 3 - 1-4% below
                                                                                                                                                                                                                • N
                                                                                                                                                                                                                  Rating 2 - 5-9% below
                                                                                                                                                                                                                • N
                                                                                                                                                                                                                  Rating 1 - 10-15% below
                                                                                                                                                                                                                • N
                                                                                                                                                                                                                    Rating 0 - >15% below
                                                                                                                                                                                                                  • NP
                                                                                                                                                                                                                    Preferred for blocks of text
                                                                                                                                                                                                                  • N+
                                                                                                                                                                                                                    Add 15 Lc to use for blocks of text
                                                                                                                                                                                                                  • N
                                                                                                                                                                                                                    Font weight 100 should be avoided
                                                                                                                                                                                                                  • X
                                                                                                                                                                                                                    Prohibited except for decorative purposes
                                                                                                                                                                                                                  • ©
                                                                                                                                                                                                                    Use for copyright/by-line only

                                                                                                                                                                                                                  Example font combinations & ratings

                                                                                                                                                                                                                  14px/400
                                                                                                                                                                                                                  Rating: 0
                                                                                                                                                                                                                  16px/400
                                                                                                                                                                                                                  Rating: 0
                                                                                                                                                                                                                  16px/600
                                                                                                                                                                                                                  Rating: 0
                                                                                                                                                                                                                  24px/500
                                                                                                                                                                                                                  Rating: 0
                                                                                                                                                                                                                  30px/300
                                                                                                                                                                                                                  Rating: 0

                                                                                                                                                                                                                  Attributions

                                                                                                                                                                                                                  SAPC & APCA were invented / developed by Andrew Somers, Senior Color Science Researcher at Myndex Technologies as part of the ongoing PerceptEx™ Perception Research Project.

                                                                                                                                                                                                                  SAPC: S-LUV Advanced Perceptual Color — an appearance model for self-illuminated displays

                                                                                                                                                                                                                  APCA: Advanced Perceptual Contrast Algorithm — a method for determining contrast to guide web-based design.

                                                                                                                                                                                                                  APCA is derived from the SAPC model. APCA is a method for prediction pf suprathreshold visual contrast of text on displays. APCA results are intended to provide design guidance for best readability of web-based content.

                                                                                                                                                                                                                  APCA DISCLAIMER

                                                                                                                                                                                                                  APCA is intended solely for web-based content per the W3 WCAG 3.0 standards, and the web-content version is licensed to the W3 per their cooperative agreement. Use for other-than web-based-content is restricted and/or prohibited. APCA is a public beta, under active development. Prior written authorization is required for the use of SAPC or APCA in the context of, or in applications for, transportation, aerospace, medical, military, or where human safety is involved.

                                                                                                                                                                                                                  #36649d
                                                                                                                                                                                                                  |
                                                                                                                                                                                                                  rgb(54, 100, 157)
                                                                                                                                                                                                                  Contrast value

                                                                                                                                                                                                                  1.53:1

                                                                                                                                                                                                                  #4e82c2
                                                                                                                                                                                                                  |
                                                                                                                                                                                                                  rgb(78, 130, 194)
                                                                                                                                                                                                                  Sample text
                                                                                                                                                                                                                  Share these colors

                                                                                                                                                                                                                  Normal text

                                                                                                                                                                                                                  WCAG 2.1 AA
                                                                                                                                                                                                                  fail
                                                                                                                                                                                                                  WCAG 2.1 AAA
                                                                                                                                                                                                                  fail

                                                                                                                                                                                                                  Large text

                                                                                                                                                                                                                  Text that is 14pt (18.67px) and bold or any text bigger than 18pt (24px) is defined as large scale text.

                                                                                                                                                                                                                  WCAG 2.1 AA
                                                                                                                                                                                                                  fail
                                                                                                                                                                                                                  WCAG 2.1 AAA
                                                                                                                                                                                                                  fail