is-dark
TypeScript icon, indicating that this package has built-in type declarations

1.0.4 • Public • Published

is-dark

Detect whether or not the system is in dark mode from the browser.

Come to the dark side!

Rationale

The choice of whether to enable a light or dark appearance is an aesthetic one for most users, and might not relate to ambient lighting conditions. Websites should support both appearances and react to changes at the system level.

Installation

Install the package using npm or yarn

npm install -S is-dark
yarn add is-dark

Usage

Check Once

To check once, simply call the default export from is-darkmode.

import isDarkMode from 'is-darkmode'
 
isDarkMode() // true | false

Subscribe to System Changes

To subscribe to system UI changes, call the onChange method.

import { subscribeToColorScheme } from 'is-darkmode'
 
let textColor = 'black'
let bgColor = 'white'
 
subscribeToColorScheme((scheme) => {
  switch(scheme) {
    case 'dark':
      textColor = 'white'
      bgColor = 'black'
      break;
    case 'light':
      textColor = 'black'
      bgColor = 'white'
      break;
  }
})

Readme

Keywords

Package Sidebar

Install

npm i is-dark

Weekly Downloads

5

Version

1.0.4

License

MIT

Unpacked Size

6.91 kB

Total Files

10

Last publish

Collaborators

  • willhackett