usePreferredContrast

prefers-contrast media query

Usage

Live Editor
function Demo() {
  const contrast = usePreferredContrast();

  return <div>PreferredContrast: {contrast}</div>;
};
Result

API

usePreferredContrast

Returns

Contrast

Arguments

ArgumentDescriptionTypeDefaultValue
defaultStatedefault valueContrast | undefinedno-preference

Contrast

Type

export type Contrast = 'more' | 'less' | 'custom' | 'no-preference'