30-seconds-of-code/snippets/prefersDarkColorScheme.md

title, tags

title	tags
prefersDarkColorScheme	browser,intermediate

Returns true if the user color scheme preference is dark, false otherwise.

• Use Window.matchMedia() with the appropriate media query to check the user color scheme preference.

const prefersDarkColorScheme = () =>
  window && window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;

prefersDarkColorScheme(); // true