Add color scheme matcher snippets for browser

snippets/prefersDarkColorScheme.md

@@ -0,0 +1,17 @@
+---
+title: prefersDarkColorScheme
+tags: 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.
+
+```js
+const prefersDarkColorScheme = () =>
+  window && window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
+```
+
+```js
+prefersDarkColorScheme(); // true
+```

snippets/prefersLightColorScheme.md

@@ -0,0 +1,17 @@
+---
+title: prefersLightColorScheme
+tags: browser,intermediate
+---
+
+Returns `true` if the user color scheme preference is `light`, `false` otherwise.
+
+Use `window.matchMedia()` with the appropriate media query to check the user color scheme preference.
+
+```js
+const prefersLightColorScheme = () =>
+  window && window.matchMedia && window.matchMedia('(prefers-color-scheme: light)').matches;
+```
+
+```js
+prefersLightColorScheme(); // true
+```