how can I change or override the darkTheme background color? ( or the texts colors )

[Levik931]

import React, { useState } from "react";
import ReactDOM from "react-dom";
import App from "./App.jsx";
import { Provider, darkTheme, lightTheme } from "@adobe/react-spectrum";

function Main() {
  const [selected, setSelection] = useState(true);

  const themeChanger = () => {
    setSelection((prev) => !prev);
  };

  return (
    <Provider theme={selected ? lightTheme : darkTheme} colorScheme="light">
      <App themeChanger={themeChanger} />
    </Provider>
  );
}

ReactDOM.render(<Main />, document.getElementById("root"));

[yihuiliao]

Please let me know if I have misunderstood anything but it seems like based on the code snippet you’ve shared that there’s the option to select either the lightTheme or darkTheme but you want to override the darkTheme to always be light. In short, it seems like you are looking to maintain a light theme regardless of the selection. It’s a little hard to tell without more context but that is how I am understanding it.

If that’s the case, you can pass defaultTheme to the theme prop and keep colorScheme=“light” and it will always default to the light theme. So like this:

<Provider theme={defaultTheme} colorScheme=“light”>