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