brand/colors

ID:
brand/colors
Automated score:
97.2
URL:
https://stackoverflow.design/brand/colors
View JSON file

3 violations: Light: 1 Dark: 1 HC 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-300 ff-mono ml-auto py1">n/a</span>

Target

section:nth-child(4) > .flex__allitems4.g32.ff-row-wrap > .s-card.wmn2.bs-sm:nth-child(2) > .p12 > .pt8.pb6.fc-medium > .fc-black-300.ff-mono.py1

Summary

Fix all of the following:

  • Element has insufficient APCA custom level contrast of 34.86Lc (foreground color: #babfc5, background color: #ffffff, font size: 9.8pt (13px), font weight: 400). Expected minimum APCA lightness contrast of 60Lc

HTML

<span class="fc-black-300 ff-mono ml-auto py1">n/a</span>

Target

.s-card.wmn2.bs-sm:nth-child(1) > .p12 > .pt8.pb6.fc-medium > .fc-black-300.ff-mono.py1

Summary

Fix all of the following:

  • Element has insufficient APCA custom level contrast of 34.86Lc (foreground color: #babfc5, background color: #ffffff, font size: 9.8pt (13px), font weight: 400). Expected minimum APCA lightness contrast of 60Lc

HTML

<span class="fc-black-300 ff-mono ml-auto py1">n/a</span>

Target

section:nth-child(5) > .flex__allitems4.g32.ff-row-wrap > .s-card.wmn2.bs-sm:nth-child(2) > .p12 > .pt8.pb6.fc-medium > .fc-black-300.ff-mono.py1

Summary

Fix all of the following:

  • Element has insufficient APCA custom level contrast of 34.86Lc (foreground color: #babfc5, background color: #ffffff, font size: 9.8pt (13px), font weight: 400). Expected minimum APCA lightness contrast of 60Lc

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-300 ff-mono ml-auto py1">n/a</span>

Target

section:nth-child(4) > .flex__allitems4.g32.ff-row-wrap > .s-card.wmn2.bs-sm:nth-child(2) > .p12 > .pt8.pb6.fc-medium > .fc-black-300.ff-mono.py1

Summary

Fix all of the following:

  • Element has insufficient APCA custom level contrast of 27.65Lc (foreground color: #73787d, background color: #252627, font size: 9.8pt (13px), font weight: 400). Expected minimum APCA lightness contrast of 60Lc

HTML

<span class="fc-black-300 ff-mono ml-auto py1">n/a</span>

Target

.s-card.wmn2.bs-sm:nth-child(1) > .p12 > .pt8.pb6.fc-medium > .fc-black-300.ff-mono.py1

Summary

Fix all of the following:

  • Element has insufficient APCA custom level contrast of 27.65Lc (foreground color: #73787d, background color: #252627, font size: 9.8pt (13px), font weight: 400). Expected minimum APCA lightness contrast of 60Lc

HTML

<span class="fc-black-300 ff-mono ml-auto py1">n/a</span>

Target

section:nth-child(5) > .flex__allitems4.g32.ff-row-wrap > .s-card.wmn2.bs-sm:nth-child(2) > .p12 > .pt8.pb6.fc-medium > .fc-black-300.ff-mono.py1

Summary

Fix all of the following:

  • Element has insufficient APCA custom level contrast of 27.65Lc (foreground color: #73787d, background color: #252627, font size: 9.8pt (13px), font weight: 400). Expected minimum APCA lightness contrast of 60Lc

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

<span class="fc-black-300 ff-mono ml-auto py1">n/a</span>

Target

section:nth-child(4) > .flex__allitems4.g32.ff-row-wrap > .s-card.wmn2.bs-sm:nth-child(2) > .p12 > .pt8.pb6.fc-medium > .fc-black-300.ff-mono.py1

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.71 (foreground color: #73787d, background color: #000000, font size: 9.8pt (13px), font weight: normal). Expected contrast ratio of 7:1

HTML

<span class="fc-black-300 ff-mono ml-auto py1">n/a</span>

Target

.s-card.wmn2.bs-sm:nth-child(1) > .p12 > .pt8.pb6.fc-medium > .fc-black-300.ff-mono.py1

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.71 (foreground color: #73787d, background color: #000000, font size: 9.8pt (13px), font weight: normal). Expected contrast ratio of 7:1

HTML

<span class="fc-black-300 ff-mono ml-auto py1">n/a</span>

Target

section:nth-child(5) > .flex__allitems4.g32.ff-row-wrap > .s-card.wmn2.bs-sm:nth-child(2) > .p12 > .pt8.pb6.fc-medium > .fc-black-300.ff-mono.py1

Summary

Fix any of the following:

  • Element has insufficient color contrast of 4.71 (foreground color: #73787d, background color: #000000, font size: 9.8pt (13px), font weight: normal). Expected contrast ratio of 7:1