Skip to main content

API Overview



A map defining the WCAG standard contrast ratios.


a11y ( $a11y-color, $other-color [, $size] [, $level] )

Finds the nearest accessible color for the given color against another given color according to the specified WCAG standard contrast ratio.

contrast ( $first-color, $second-color )

The WCAG contrast ratio between two colors, from 1 to 21 (commonly written 1:1 to 21:1).

is-dark ( $color )

Indicates whether a given color is considered dark.

is-light ( $color )

Indicates whether a given color is considered light.

luminance ( $color )

Returns a number indicating the WCAG relative luminance of the given color.

Don’t see the function you’re looking for? Request a new feature describing a use case.

Combined API

In order to avoid constantly declaring both the native sass:color module and this library, the combined API has been added which merges the two.

// Rather than using both modules separately...
@use '@sass-fairy/color';
@use 'sass:color';

// ...this statement will accomplish the same thing.
@use '@sass-fairy/color/color';