useColorScheme

React TSX

import {useColorScheme} from 'react-native';

useColorScheme is a React Hook that provides and subscribes to color scheme updates from the Appearance module. The return value indicates the user's current preferred color scheme. This value may update in the future, which can happen due to direct user action (for example, a theme choice in device settings) or scheduled updates (for example, switching between light and dark themes following the day/night cycle).

Supported color schemes

• "light": The user prefers a light theme.
• "dark": The user prefers a dark theme.
• null: The user has not indicated a preferred color scheme.

---

Example

A complete example can be found in AppearanceExample.js, which demonstrates using this hook together with React context to add support for light and dark themes to your app.