Questions tagged [contrast]
is the difference in luminance and/or color that makes an object (or its representation in an image or display) distinguishable.
88 questions
2 votes
1 answer
110 views
Are StackExchange's blockquote colors inaccessable?
I was informed in a separate conversation that StackExchange's block quote colors are inaccessable - that they do not offer enough contrast. It looks like they use #3b4045 on white background for ...
- 123
1 vote
2 answers
156 views
Good dotted line contrast style
I've done a quick search online and couldn't find any results for this in particular. What I have is an image editing user interface that needs to display dotted lines over the image as guide lines. I'...
- 11
0 votes
3 answers
285 views
Non-text Contrast (Level AA) with input field background against a web page background
I have a question regarding the accessibility of this design and whether it complies with WCAG guidelines and success criteria. Below is an image of a set of input fields on a specific background: ...
- 23
2 votes
2 answers
363 views
Can the current page in a breadcrumb be considered disabled, allowing it to not meet contrast requirements?
Our UX and design teams were discussing breadcrumbs, and if the current page is considered a "disabled" element. We already style the current page so it is obviously not linked, like the out-...
1 vote
1 answer
1k views
Yellow in high contrast modes
We're implementing different color themes across our apps. All our basic themes are WCAG level AA compliant, but now it's high contrast theme's turn. It's going to be a theme that features maximum ...
- 2,693
2 votes
1 answer
505 views
WCAG' Non-text contrast requirements, what exactly are the guidelines with hover?
WCAG does a weird job of explaining their non-text contrast requirements with hover states. Within their "Understanding non-text contrast" documentation, they have this bizarre example: As ...
- 5,525
0 votes
1 answer
370 views
Text Contrast Issue: How to enhance a hero image section?
I'm using a hero image as a landing page for a ecommerce site. Here's what it looks like so far: I'm having issues with the text's contrast over the background image. Any ideas on how I can make the ...
- 1
2 votes
1 answer
426 views
(WCAG 1.4.11) Understanding 'subsuming' in Non-text Contrast AA Level
In a vaccuuum I understand how to interpret the criterion. If a border is the only way to identify a control then Border vs container must have >3 contrast. If a background is the only way to ...
0 votes
1 answer
933 views
How to check contrast of a transparent button with a border?
Simple question but I can't find the correct way to test. I have a normal button, that is transparent but has a border colour with some opacity. I'm not convinced that the contrast ration is high ...
- 45
3 votes
2 answers
1k views
Are contrast checkers really accurate?
Is WCAG AA level truly necessary? I'm having difficulty making optimal contrast choices, and honestly, bold text, even at 16px, appears much more readable than regular text. Additionally, I often ...
- 194
0 votes
1 answer
2k views
Do small icons have to pass at least 3:1 for contrast accessibility?
Can anyone clarify if icons (UI elements) 20x20 etc have to be 3:1 and is that a recommendation? Thanks
- 101
0 votes
2 answers
2k views
APCA (WCAG 3.0) does not allow for 14px font to be used as a regular base
According to APCA (WCAG 3.0), we are not able to use 14px font as a regular base, but when it comes to SaaS application design, 14px is commonly used as the base font size. Despite my attempt to use ...
13 votes
4 answers
4k views
Change link color based in background color?
Our white-background webpages use the blue hyperlinks as shown in the image below. Occasionally we have dash-bordered yellow information sections on a white webpage as shown. In that case someone said ...
- 265
0 votes
2 answers
2k views
Background video & accessibility of text overlays
I have a situation with an autoplaying video banner (you know the type, full screen html background element) where there is text overlayed on top of it -- common in marketing landing pages and their ...
- 1
0 votes
1 answer
203 views
How do you create both sufficient contrast and a harmonious outcome for text on different tints of the same color?
Here are two examples. One is a table, the other an illustration. Both use different tints of the same color with text on top. How do you change the color of the text across these tints to be both ...
- 31