product/components/empty-states

ID:
product/components/empty-states
Automated score:
99.1
URL:
https://stackoverflow.design/product/components/empty-states
View JSON file

1 violations: HC Light: 1

Ensure the contrast between foreground and background colors meets WCAG 2 AAA enhanced contrast ratio thresholds. Elements must meet enhanced color contrast ratio thresholds. Help URL

HTML

<p>We couldn’t find any tags matching <span class="s-tag d-inline-block">stacks-1-0-0</span>. It might not exist yet. Would you like to create it?</p>

Target

.stacks-preview:nth-child(5) > .bg-black-100.stacks-preview--example > .s-empty-state.wmx4.p48 > p

Summary

Fix any of the following:

  • Element has insufficient color contrast of 6.79 (foreground color: #525960, background color: #f9fafa, font size: 9.8pt (13px), font weight: normal). Expected contrast ratio of 7:1

HTML

<p>We couldn’t match users for <strong>Namey McUser</strong>. Try refining your search or trying something more general.</p>

Target

.stacks-preview:nth-child(8) > .bg-black-100.stacks-preview--example > .s-empty-state.wmx4.p48 > p

Summary

Fix any of the following:

  • Element has insufficient color contrast of 6.79 (foreground color: #525960, background color: #f9fafa, font size: 9.8pt (13px), font weight: normal). Expected contrast ratio of 7:1