system/components/badges

ID:
system/components/badges
Automated score:
99
URL:
https://stackoverflow.design/system/components/badges
View JSON file

1 violations: Dark: 1

Ensures the contrast between foreground and background colors meets APCA custom level conformance minimums thresholds. Elements must meet APCA conformance minimums thresholds. Help URL

HTML

<span class="fc-black-350">N/A</span>

Target

td:nth-child(3) > .fc-black-350

Summary

Fix all of the following:

  • Element has insufficient APCA custom level contrast of 53.33Lc (foreground color: #a6a6a6, background color: #141414, font size: 9.8pt (13px), font weight: 300). Expected minimum APCA lightness contrast of 60Lc

HTML

<span class="fc-black-350">N/A</span>

Target

tr:nth-child(1) > .va-middle:nth-child(2) > .fw-wrap.g4.d-flex > .fc-black-350

Summary

Fix all of the following:

  • Element has insufficient APCA custom level contrast of 53.33Lc (foreground color: #a6a6a6, background color: #141414, font size: 10.5pt (14px), font weight: 400). Expected minimum APCA lightness contrast of 60Lc

HTML

<span class="fc-black-350">N/A</span>

Target

tr:nth-child(2) > .va-middle:nth-child(2) > .fw-wrap.g4.d-flex > .fc-black-350

Summary

Fix all of the following:

  • Element has insufficient APCA custom level contrast of 53.33Lc (foreground color: #a6a6a6, background color: #141414, font size: 10.5pt (14px), font weight: 400). Expected minimum APCA lightness contrast of 60Lc