use-prefers-color-scheme

React hook for determining the preferred color scheme

Usage no npm install needed!

<script type="module">
  import usePrefersColorScheme from 'https://cdn.skypack.dev/use-prefers-color-scheme';
</script>

README

use-prefers-color-scheme

React hook for determining the preferred color scheme

Install

npm install --save use-prefers-color-scheme

Usage

import React from 'react'

import usePrefersColorScheme from 'use-prefers-color-scheme'

const App = () => {
  const preferredColorSchema = usePrefersColorScheme()
  const isDarkMode = preferredColorSchema === 'dark'

  return (
    <div>You are using {isDarkMode ? 'Dark Mode 🌚' : 'Light Mode 🌞'}!</div>
  )
}

License

MIT © rfoel