Passed Passed Example 1 Open in a new tab This dark gray text has a contrast ratio of 12.6:1
on the white background.
Some text in a human language
Passed Shadow DOM Test 1
Passed Example 2 Open in a new tab This dark gray text has a contrast ratio between 12.6:1
and 5:1 on the white to blue gradient background.
Some text in a human language
Passed Shadow DOM Test 2
Passed Example 3 Open in a new tab This light gray text has a contrast ratio between 13:1
and 5:1 on the background image.
Black hole sun
Passed Shadow DOM Test 3
Passed Example 5 Open in a new tab This 18pt large black text has a contrast ratio of 3.6:1
on the gray background.
Some text in a human language
Passed Shadow DOM Test 5
Passed Example 6 Open in a new tab This 14pt bold black text has a contrast ratio of 3.6:1
on the gray background.
Some text in English
Passed Shadow DOM Test 6
Passed Example 8 Open in a new tab This text has the default browser text color on the
default browser background color. By default this is black text on a white background, which
has a contrast ratio of 21:1.
Some text in a human language
Passed Shadow DOM Test 8
Passed Example 10 Open in a new tab This text has the default user agent link text and
background color, of #0000EE and white. This results in a contrast ratio of 9.39:1.
W3C
Passed Shadow DOM Test 10
Passed Example 11 Open in a new tab This text is using the default user agent text color and
background color. By default, this is black text on a white background with a contrast ratio
of 21:1
My button!
Passed Shadow DOM Test 11
Failed Failed Example 1 Open in a new tab This light gray text has a contrast ratio of 2.3:1
on the white background.
Some text in English
Failed Shadow DOM Test 1
Failed Example 4 Open in a new tab This black text with 30% alpha channel has a contrast
ratio of 2.1:1 on the white background.
Some text in English
Failed Shadow DOM Test 4
Failed Example 5 Open in a new tab This black text with 30% opacity has a contrast ratio of
2.1:1 on the white background.
Some text in English
Failed Shadow DOM Test 5
Failed Example 6
Open in a new tab
This light gray text has a contrast ratio of 2.3:1 on the white background in a shadow DOM tree.
Failed Example 8 Open in a new tab The first p element has a contrast ratio of 12.6:1. The
second p element, which contains an example of the Helvetica font, has a contrast ratio of
3.85:1. Because this provides information, and is not only for aesthetic purposes, this is
not considered purely decorative.
Helvetica is a widely used sans-serif typeface developed in 1957 by Max Miedinger and
Eduard Hoffmann.
The quick brown fox jumps over the lazy dog.
Failed Shadow DOM Test 8
Failed Example 9 Open in a new tab This text in a button element has a contrast ratio of
3.85:1.
Failed Shadow DOM Test 9
Failed Example 10 Open in a new tab This text in a semantic button has a contrast ratio of
3.85:1.
My button!
Failed Shadow DOM Test 10
Inapplicable Inapplicable Example 1 Open in a new tab This text is not visible because of
display: none.
Some invisible text in English
Inapplicable Shadow DOM Test 1
Inapplicable Example 2 Open in a new tab This text is not visible because it is positioned
off screen.
Some invisible text in English
Inapplicable Shadow DOM Test 2
Inapplicable Example 3 Open in a new tab This text is not visible because the foreground
color is the same as the background color.
Hidden text - U U D D L R L R B A S
Inapplicable Shadow DOM Test 3
Inapplicable Example 4 Open in a new tab This text is not the child of an HTML element.
Inapplicable Shadow DOM Test 4
Inapplicable Example 5 Open in a new tab This text not part of a text node.
Inapplicable Shadow DOM Test 5
Inapplicable Example 6 Open in a new tab This text is part of a label of a disabled widget,
because it is in a label element that is the label for an input element with type="text".
Inapplicable Shadow DOM Test 6
Inapplicable Example 7 Open in a new tab This text is part of a label of a disabled widget,
because it is in an element that is referenced by aria-labelledby from an element with
role="textbox".
test
Inapplicable Shadow DOM Test 7
Inapplicable Example 8 Open in a new tab This text is part of a label of a disabled widget,
because it is in a label element that is the label for an input element in a fieldset
element with the disabled attribute.
Inapplicable Shadow DOM Test 8
Inapplicable Example 9 Open in a new tab This text is part of a label of a disabled widget,
because it is in a label element that is the label for an input element in an element with
role="group" with the aria-disabled="true" attribute.
Inapplicable Shadow DOM Test 9
Inapplicable Example 10 Open in a new tab This text is part of a disabled widget because it
is a child of a button element with the disabled attribute.
Inapplicable Shadow DOM Test 10
Inapplicable Example 11 Open in a new tab This text is part of a disabled widget because it
is a child of an element with the role attribute set to button and with an aria-disabled
attribute set to true.
My button!
Inapplicable Shadow DOM Test 11
You may shoot me with your words,
You may cut me with your eyes,
You may kill me with your hatefulness,
But still, like air, I'll rise.
