[bug] titleBarStyle: "Transparent" Uses Opposite Hex Color for Background on macOS

[nathancovey]

Describe the bug

When setting "titleBarStyle": "Transparent" and specifying a backgroundColor in a Tauri app on macOS, the expected behavior is for the title bar to match the provided background color. However, instead of using the exact hex color, Tauri applies what seems to be the opposite color, or black.

Reproduction

Set the titleBarStyle to "Transparent" and specify a backgroundColor in tauri.conf.json:

{
  "tauri": {
    "windows": [
      {
        "titleBarStyle": "Transparent",
        "backgroundColor": "#00FF00"
      }
    ]
  }
}

Expected behavior

Observe that the title bar does not match the given background color.

Example: Setting a green background (#00FF00) results in a black title bar.

A temporary fix is to manually use the opposite hex value to get the intended background color.

Full tauri info output

[✔] Environment
    - OS: Mac OS 15.1.1 arm64 (X64)
    ✔ Xcode Command Line Tools: installed
    ✔ rustc: 1.83.0 (90b35a623 2024-11-26)
    ✔ cargo: 1.83.0 (5ffbef321 2024-10-29)
    ✔ rustup: 1.27.1 (54dd3d00f 2024-04-24)
    ✔ Rust toolchain: stable-aarch64-apple-darwin (default)
    - node: 20.18.0
    - npm: 10.9.2

[-] Packages
    - tauri 🦀: 2.1.1
    - tauri-build 🦀: 2.0.3
    - wry 🦀: 0.47.2
    - tao 🦀: 0.30.8
    - @tauri-apps/api : 2.1.1 (outdated, latest: 2.2.0)
    - @tauri-apps/cli : 2.1.0 (outdated, latest: 2.2.3)

[-] Plugins
    - tauri-plugin-shell 🦀: 2.2.0
    - @tauri-apps/plugin-shell : not installed!
    - tauri-plugin-sql 🦀: 2.2.0
    - @tauri-apps/plugin-sql : 2.2.0

[-] App
    - build-type: bundle
    - CSP: unset
    - frontendDist: ../dist
    - devUrl: http://localhost:1420/
    - framework: React
    - bundler: Vite

Stack trace

No response

Additional context

No response