Function: usePrefersContrast()

@arolariu/components

---

@arolariu/components / usePrefersContrast

Function: usePrefersContrast()

usePrefersContrast(): boolean

Defined in: hooks/usePrefersContrast.tsx:22

Returns whether the user prefers higher contrast.

Returns

boolean

true when prefers-contrast: more is active.

Remarks

Wraps a prefers-contrast media query in a semantic accessibility hook so components can adapt borders, focus states, and surface styling without repeating query strings.

Example

const highContrast = usePrefersContrast();

See

• useMediaQuery — Shared media-query subscription hook.
• MDN prefers-contrast