- $ui-yellow#FFB506
Usage
- 'Warning' state for UI components
- Anything else
Accessibility
White
- Contrast ratio 1.77:1
- WCAG 2 AA Compliant Failed
- WCAG 2 AA Compliant(18pt+) Failed
- WCAG 2 AAA Compliant Failed
- WCAG 2 AAA Compliant(18pt+) Failed
Avoid UI yellow on white
Avoid white on UI yellow
Grey
- Contrast ratio 6.33:1
- WCAG 2 AA Compliant Passed
- WCAG 2 AA Compliant(18pt+) Passed
- WCAG 2 AAA Compliant Failed
- WCAG 2 AAA Compliant(18pt+) Passed
Use UI yellow on grey
Use grey on UI yellow
Background blue
- Contrast ratio 1.34:1
- WCAG 2 AA Compliant Failed
- WCAG 2 AA Compliant(18pt+) Failed
- WCAG 2 AAA Compliant Failed
- WCAG 2 AAA Compliant(18pt+) Failed
Avoid UI yellow on background blue
Background green
- Contrast ratio 1.36:1
- WCAG 2 AA Compliant Failed
- WCAG 2 AA Compliant(18pt+) Failed
- WCAG 2 AAA Compliant Failed
- WCAG 2 AAA Compliant(18pt+) Failed
Avoid UI yellow on background green
Background red
- Contrast ratio 1.22:1
- WCAG 2 AA Compliant Failed
- WCAG 2 AA Compliant(18pt+) Failed
- WCAG 2 AAA Compliant Failed
- WCAG 2 AAA Compliant(18pt+) Failed
Avoid UI yellow on background red
Background grey
- Contrast ratio 1.37:1
- WCAG 2 AA Compliant Failed
- WCAG 2 AA Compliant(18pt+) Failed
- WCAG 2 AAA Compliant Failed
- WCAG 2 AAA Compliant(18pt+) Failed
Avoid UI yellow on background grey
Background yellow
- Contrast ratio 1.53:1
- WCAG 2 AA Compliant Failed
- WCAG 2 AA Compliant(18pt+) Failed
- WCAG 2 AAA Compliant Failed
- WCAG 2 AAA Compliant(18pt+) Failed
Avoid UI yellow on background yellow
Background cream
- Contrast ratio 1.71:1
- WCAG 2 AA Compliant Failed
- WCAG 2 AA Compliant(18pt+) Failed
- WCAG 2 AAA Compliant Failed
- WCAG 2 AAA Compliant(18pt+) Failed
Avoid UI yellow on background cream
