Contrast tools

#636b74
|
rgb(99, 107, 116)
Contrast value

72.96 Lc

#fdf8ed
|
rgb(253, 248, 237)
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: 4
                            24px/500
                            Rating: 4
                            30px/300
                            Rating: 4

                            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.

                            #636b74
                            |
                            rgb(99, 107, 116)
                            Contrast value

                            5.10:1

                            #fdf8ed
                            |
                            rgb(253, 248, 237)
                            Sample text
                            Share these colors

                            Normal text

                            WCAG 2.1 AA
                            pass
                            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
                            pass
                            WCAG 2.1 AAA
                            pass