Text component cannot be set to black in dark mode

[NothingHere404]

Problem Description

Text component cannot be set to black in dark mode. Despite setting color: "# 000" in the code, it still cannot be rendered.

Steps To Reproduce

        <Text style={{ fontWeight: 'bold', color:"#000" }}>FancyMath:</Text>

Expected Results

The color of the text component should be consistent with the code settings.

CLI version

17.0.0

Environment

PS D:\VSProjects\native-module-sample> npx @react-native-community/cli info
info Fetching system and libraries information...
System:
  OS: Windows 11 10.0.26200
  CPU: (22) x64 Intel(R) Core(TM) Ultra 7 155H
  Memory: 15.28 GB / 31.52 GB
Binaries:
  Node:
    version: 24.11.0
    path: C:\Program Files\nodejs\node.EXE
  Yarn:
    version: 3.6.1
    path: C:\Users\auser\AppData\Roaming\npm\yarn.CMD
  npm:
    version: 11.6.1
    path: C:\Program Files\nodejs\npm.CMD
  Watchman: Not Found
SDKs:
  Android SDK:
    API Levels:
      - "35"
      - "36"
      - "36"
    Build Tools:
      - 35.0.0
      - 36.0.0
      - 36.1.0
    Android NDK: Not Found
  Windows SDK:
    AllowDevelopmentWithoutDevLicense: Enabled
    AllowAllTrustedApps: Enabled
    Versions:
      - 10.0.22621.0
      - 10.0.26100.0
IDEs:
  Android Studio: Not Found
  Visual Studio:
    - 18.0.11201.2 (Visual Studio Community 2026)
Languages:
  Java:
    version: 17.0.17
    path: C:\Program Files\BellSoft\LibericaJDK-17\bin\javac.EXE
  Ruby: Not Found
npmPackages:
  "@react-native-community/cli":
    installed: 20.0.1
    wanted: 20.0.1
  react:
    installed: 19.1.0
    wanted: 19.1.0
  react-native:
    installed: 0.80.2
    wanted: 0.80.2
  react-native-windows:
    installed: 0.80.1
    wanted: ^0.80.0
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: Not found
  newArchEnabled: Not found
iOS:
  hermesEnabled: Not found
  newArchEnabled: Not foun

Community Modules

No response

Target React Native Architecture

None

Target Platform Version

None

Visual Studio Version

None

Build Configuration

None

Snack, code example, screenshot, or link to a repository

No response

[Nitin-100]

@NothingHere404 This is not a bug, explicitly setting black is working for both light and dark themes, If the background will be black then you will not see black text obliviously.

[NothingHere404]

Please retest the issue.

I obtained this screenshot using these codes. In dark themes, white is displayed on a white background regardless of whether the text is set to black or white. On a black background, white is displayed regardless of whether the text is set to black or white.

function App() {
  const isDarkMode = useColorScheme() === 'dark';

  return (
    <View style={styles.container}>
      <StatusBar barStyle={isDarkMode ? 'light-content' : 'dark-content'} />
      <View
        style={{
          backgroundColor: 'white',
          borderColor: 'green',
          borderWidth: 2,
        }}
      >
        <Text style={{ color: 'red' }}>Hello World!</Text>
        <Text style={{ color: '#000' }}>Hello World!</Text>
        <Text style={{ color: 'white' }}>Hello World!</Text>
        <Text style={{ color: 'green' }}>Hello World!</Text>
      </View>
      <View
        style={{
          backgroundColor: '#000',
          borderColor: 'yellow',
          borderWidth: 2,
        }}
      >
        <Text style={{ color: 'red' }}>Hello World!</Text>
        <Text style={{ color: '#000' }}>Hello World!</Text>
        <Text style={{ color: 'white' }}>Hello World!</Text>
        <Text style={{ color: 'green' }}>Hello World!</Text>
      </View>
    </View>
  );
}

But in light mode, this displays normally. The expected display in dark mode should be consistent with that in light mode. Because this is a manually controlled color.

[Nitin-100]

This is expected behavior "White on black background and vice-versa", Also if color of text and background are same without transparency it will not be visible

[acoates-ms]

Is this in old arch or new architecture? -- I'm not able to reproduce this in the new architecture.

[NothingHere404]

I will provide a code repository.

https://github.com/NothingHere404/wantby.git

[NothingHere404]

Is this in old arch or new architecture? -- I'm not able to reproduce this in the new architecture.

From this file, it is looks like new architecture

https://github.com/NothingHere404/wantby/blob/main/windows/ExperimentalFeatures.props

[Nitin-100]

This is fixed in next version; this is due to some wrong fix went into the code.