PreferenceManager: contrast property

{{APIRef("User Preferences API")}}{{SeeCompatTable}}{{SecureContext_Header}}

The contrast read-only property of the {{domxref("PreferenceManager")}} interface returns a {{domxref("PreferenceObject")}} used to override the user's preference for the contrast of the site.

Valid contrast {{domxref("PreferenceObject.value")}} settings are more, less, and no-preference.

Value

A {{domxref("PreferenceObject")}} used to override the user's preference for the contrast of the site.

Examples

Basic usage

This example demonstrates how to query the user's contrast preference.

if (navigator.preferences.contrast.value === "more") {
  // The user prefers a high color contrast.
} else if (navigator.preferences.contrast.value === "less") {
  // The user prefers a low color contrast.
} else {
  // The user has stated no preference regarding color contrast.
}

Specifications

{{Specifications}}

Browser compatibility

{{Compat}}