🪄 React Browser Theme Detect

Usage

Add the dependency:

NPM

npm install @redredgroup/react-browser-theme-detect

Yarn

yarn add @redredgroup/react-browser-theme-detect

Example

Import the package:

import { isTheme, isThemeLight, isThemeDark } from "@redredgroup/react-browser-theme-detect";

Returns the String value for dark mode or light mode:

const themeString = isTheme();
// Returns "light" or "dark"

When the Boolean value for dark mode detection is required,

const isDark = isThemeDark();
// If it is in dark mode, return true or false

const isLight = isThemeLight();
// If it is in dark mode, return true or false

💡 Browser support

This package only works in browsers that natively support @media (prefers-color-scheme), so it just returns "light" in unsupported browsers. Current browser support