dequelabs / dequelabs/axe-core

Some Fonts Are Bold by Default and Only Need to Meet 3 to 1 Color Contrast when large

Open
#2,089 6 comments 0 reactions 0 assignees View on GitHub
color contrast rule metadata
Dominant language
JavaScript
Stars
7.5k
Forks
933
Avg merge
2d 23h
Merged PRs (30d)
17

Description

Axe is reporting 3 color contrast fails on this page: https://citiqa.mindsmack.com/supportfemalemusic (this URL content may change quickly so I'm also including code snippets).

font-family: "Interstate-Bold";
font-size: 20px;

Axe reports:
Element has insufficient color contrast of 3.16 (foreground color: #ffffff, background color: #ff40b4, font size: 15.0pt (20px), font weight: normal). Expected contrast ratio of 4.5:1

WCAG 2.x glossary definition: large scale (text) with at least 18 point or 14 point bold or font size that would yield equivalent size for Chinese, Japanese and Korean (CJK) fonts

Expectation: Interstate-Bold at 15.0 pt(20px) only needs to meet 3 to 1 because the FONT is bold itself.

Actual: Axe is inaccurately reporting a WCAG 2.x failure of 1.4.3

Motivation: Please account for fonts that are bold by default..and do not fail this.

axe-core version: 3.4.0
axe-browser extension: 4.2.1

Browser Firefox 74 on Mac 10.15.3

Screen Shot 2020-03-10 at 12 55 09 PM

(This issue was brought to me by Todd Liebsch).

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.