E-mail List Archives
Thread: contrast ration for very large text
Number of posts in this thread: 3 (In chronological order)
From: Angela French
Date: Thu, Oct 05 2017 4:58PM
Subject: contrast ration for very large text
No previous message | Next message →
Hello,
So we are working on a new set of colors for our website and I am testing color combos for contrast. Our h1 headings are set in a background color that runs across the entire page. The new color we'd like to use is #00c18B with white text. This only has a contrast ratio of 2.33:1. However the font is set at 3em which is about 36px on my monitor. Is there any leeway for XL type?
Thank you,
Angela French
Internet/Intranet Specialist
Washington State Board for Community and Technical Colleges
360-704-4316
= EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >
www.sbctc.edu<;http://www.sbctc.edu/>;
From: Ben Regis
Date: Fri, Oct 06 2017 2:56AM
Subject: Re: contrast ration for very large text
← Previous message | Next message →
HI Angela
As far as I'm aware, there isn't anything you can do to meet WCAG 2.0 AA other than increase the contrast ratio - automated tools like WAVE and aXE will give a fail with that contrast ratio even with 1000px text. Making it a bit darker at #00A879 will give the required 3:1 ratio.
Kind regards
Ben
From: Karl Brown
Date: Fri, Oct 06 2017 8:42AM
Subject: Re: contrast ration for very large text
← Previous message | No next message
AA compliance means 3:1 for large text (14pt if bold, 18pt if not bold, not
sure on the pixel sizes) or 4.5:1 for all other text. The only two
exceptions would be "incidental text" (e.g., decorative text) or logos.
I'd go with a darker text colour on white. I usually suggest going for
4.5:1 if you can just so you don't have to worry about the colour being
used for smaller fonts or users making the font size smaller in their
browser.
On Fri, Oct 6, 2017 at 9:56 AM, Ben Regis < = EMAIL ADDRESS REMOVED = > wrote:
> HI Angela
>
> As far as I'm aware, there isn't anything you can do to meet WCAG 2.0 AA
> other than increase the contrast ratio - automated tools like WAVE and aXE
> will give a fail with that contrast ratio even with 1000px text. Making it
> a bit darker at #00A879 will give the required 3:1 ratio.
>
> Kind regards
>
> Ben
>
>
>