home

ID:: home
Automated score:: 95.7
URL:: https://stackoverflow.design/

4 violations: Light: 1Dark: 1HC Light: 1HC Dark: 1

color-contrast-apca-custom

Light Serious Go to issue color-contrast-apca-custom-light

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

<div class="fw-bold fs-body3 fc-theme-primary-400 mb2">Product</div>

Target

a[href$="using-stacks"] > .flex--item:nth-child(2) > .fs-body3.mb2.fw-bold

Summary

Fix all of the following:

Element has insufficient APCA custom level contrast of 57.58Lc (foreground color: #e7700d, background color: #ffffff, font size: 12.8pt (17px), font weight: 700). Expected minimum APCA lightness contrast of 60Lc

HTML

<div class="fw-bold fs-body3 fc-theme-primary-400 mb2">Email</div>

Target

.s-card.p16.bs-sm:nth-child(2) > .flex--item:nth-child(2) > .fs-body3.mb2.fw-bold

Summary

Fix all of the following:

Element has insufficient APCA custom level contrast of 57.58Lc (foreground color: #e7700d, background color: #ffffff, font size: 12.8pt (17px), font weight: 700). Expected minimum APCA lightness contrast of 60Lc

HTML

<div class="fw-bold fs-body3 fc-theme-primary-400 mb2">Looking for brand &amp; content?</div>

Target

.bg-orange-100 > .flex--item > .fs-body3.mb2.fw-bold

Summary

Fix all of the following:

Element has insufficient APCA custom level contrast of 53.03Lc (foreground color: #e7700d, background color: #fef6f1, font size: 12.8pt (17px), font weight: 700). Expected minimum APCA lightness contrast of 60Lc

color-contrast-apca-custom

Dark Serious Go to issue color-contrast-apca-custom-dark

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

<div class="fw-bold fs-body3 fc-theme-primary-400 mb2">Looking for brand &amp; content?</div>

Target

.bg-orange-100 > .flex--item > .fs-body3.mb2.fw-bold

Summary

Fix all of the following:

Element has insufficient APCA custom level contrast of 57.1Lc (foreground color: #f7a664, background color: #4f3017, font size: 12.8pt (17px), font weight: 700). Expected minimum APCA lightness contrast of 60Lc

color-contrast-enhanced

HC Light Serious Go to issue color-contrast-enhanced-light-highcontrast

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

<div class="fw-bold fs-body3 fc-theme-primary-400 mb2">Looking for brand &amp; content?</div>

Target

.bg-orange-100 > .flex--item > .fs-body3.mb2.fw-bold

Summary

Fix any of the following:

Element has insufficient color contrast of 6.75 (foreground color: #8a440a, background color: #fef6f1, font size: 12.8pt (17px), font weight: bold). Expected contrast ratio of 7:1

color-contrast-enhanced

HC Dark Serious Go to issue color-contrast-enhanced-dark-highcontrast

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

<div class="fw-bold fs-body3 fc-theme-primary-400 mb2">Looking for brand &amp; content?</div>

Target

.bg-orange-100 > .flex--item > .fs-body3.mb2.fw-bold

Summary

Fix any of the following:

Element has insufficient color contrast of 6.95 (foreground color: #f1b27e, background color: #3f2f22, font size: 12.8pt (17px), font weight: bold). Expected contrast ratio of 7:1