Dark theme is available in Android 10 (API level 29) and higher. In iOS 13.0 and later, people can choose to adopt a dark system-wide appearance called Dark Mode. In React Native, there are two ways to know the user's appearance.

1. 0.62 or above

In 0.62.0, React Native brings some of the major changes, likes better dark mode support. The Appearance module exposes information about the user's appearance preferences, such as their preferred color scheme (light or dark).

import { Appearance } from 'react-native'

const colorScheme = Appearance.getColorScheme();
if (colorScheme === 'dark') {
  // Use dark color scheme
}

2. All Versions

Detect dark mode with react-native-dark-mode.

import { useDarkMode } from 'react-native-dark-mode'

function Component() {
  const isDarkMode = useDarkMode()
  return <View style={{ backgroundColor: isDarkMode ? 'black' : 'white' }} />
}