a11y ()
Finds the nearest accessible color for the given color against another given color according to the specified WCAG standard contrast ratio.
Parameters
$a11y-color
- The color that should change when the contrast does not meet the expected contrast ratio.
- Type
Color
$other-color
- The color that is compare against.
- Type
Color
$size
- The size category of the WCAG standard which should be used to determine compliance.
- Type
'normal' | 'large'
- Default
'normal'
$level
- The color that should change when the contrast does not meet the expected contrast ratio.
- Type
'AA' | 'AAA'
- Default
'AA'
Return Value
Color
- A color that meets the given standards for size and level in contrast to the other color.
Example
@use '@sass-fairy/color';
@debug color.a11y(red, blue);
// #ffa3a3
@debug color.a11y(red, blue, 'large');
// #ff6666
@debug color.a11y(red, blue, $level: 'AAA');
// #ffe1e1