useColorScheme() returns incorrect value when app is moved to the background on iOS

[janoslc]

Description

useColorScheme() call returns a momentarily incorrect value when the app is moved to the background. When bringing the app back in the foreground it causes a flashing behaviour, because all the components support dark and light theme.
The issue appears on ExpoGo as well as on a physical device.

Steps to reproduce

1. Set up a minimal environment for React Native on iOS
2. Call scheme = useColorScheme()
3. console.log scheme
4. Move the app to the background (ex.: switch to another app)
5. Move back the app in the foreground
6. See how scheme value was changed (to dark if you were on light theme or inverse) when the app was moved to the background and changed back again

React Native Version

0.76.7

Affected Platforms

Runtime - iOS

Output of npx react-native info

(node:86266) [DEP0040] DeprecationWarning: The `punycode` module is deprecated. Please use a userland alternative instead.
(Use `node --trace-deprecation ...` to show where the warning was created)
info Fetching system and libraries information...
System:
  OS: macOS 15.3
  CPU: (10) arm64 Apple M1 Pro
  Memory: 203.02 MB / 32.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 23.6.0
    path: /usr/local/bin/node
  Yarn: Not Found
  npm:
    version: 11.0.0
    path: /usr/local/bin/npm
  Watchman:
    version: 2024.12.02.00
    path: /opt/homebrew/bin/watchman
Managers:
  CocoaPods:
    version: 1.16.2
    path: /opt/homebrew/bin/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 24.2
      - iOS 18.2
      - macOS 15.2
      - tvOS 18.2
      - visionOS 2.2
      - watchOS 11.2
  Android SDK:
    API Levels:
      - "33"
      - "33"
      - "34"
    Build Tools:
      - 30.0.3
      - 33.0.0
      - 33.0.2
    System Images:
      - android-33 | Google APIs ARM 64 v8a
      - android-UpsideDownCake-ext5 | Google APIs ARM 64 v8a
    Android NDK: Not Found
IDEs:
  Android Studio: 2022.1 AI-221.6008.13.2211.9619390
  Xcode:
    version: 16.2/16C5032a
    path: /usr/bin/xcodebuild
Languages:
  Java: Not Found
  Ruby:
    version: 2.6.10
    path: /usr/bin/ruby
npmPackages:
  "@react-native-community/cli":
    installed: 15.1.3
    wanted: latest
  react:
    installed: 18.3.1
    wanted: 18.3.1
  react-native:
    installed: 0.76.7
    wanted: 0.76.7
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: Not found
  newArchEnabled: Not found
iOS:
  hermesEnabled: Not found
  newArchEnabled: Not found

info React Native v0.77.0 is now available (your project is running on v0.76.7).
info Changelog: https://github.com/facebook/react-native/releases/tag/v0.77.0
info Diff: https://react-native-community.github.io/upgrade-helper/?from=0.76.7&to=0.77.0
info For more info, check out "https://reactnative.dev/docs/upgrading?os=macos".

Stacktrace or Logs

Not applicable - it's a visual issue.

Reproducer

https://snack.expo.dev/@janoslc/react-native-usecolorscheme-issue

Screenshots and Videos

The Snack in Expo Go looks like this:

ScreenRecording_02-11-2025.mp4

Having a bigger project with multiple components reduces the speed of re-rendering and it causes a flashing effect:

ScreenRecording_02-11-2025.17-13-21_1.mov

[janoslc]

Related issue: #35972

[artur-burlak]

Have same issues. Not happens all the time, but happens

[sarthak-d11]

Hi @janoslc,

I am unable to reproduce this issue with the reproducer you have provided. I am currently testing it on a simulator. Could you please confirm if reproducing it on a real device is required?

Additionally, I noticed that there are no details of the New Architecture in the output of your npx react-native info. Could you please share those details as well?

[janoslc]

Hey @sarthak-d11

• It can be reproduced in Expo Go using an iOS simulator. Not particularly the flashing behavior, but the incorrect value of useColorScheme() at the moment when the app is moved to the background
• New Arch is enabled

[riteshshukla04]

This is actually expected behaviour from iOS and happens on native iOS too.

Please refer https://stackoverflow.com/questions/63372625/ios-dark-mode-user-interface-style-changes-back-and-forth-on-entering-on-the-ba

[artur-burlak]

@riteshshukla04 okay, but should be flickering should not appear anyway. And it was not on bridglessMode OFF

[riteshshukla04]

#35972 (comment)

Maybe use something like above