Dark mode

Toggle between light and dark mode using NativeWind.

1. Set up dark mode

   module.exports = {
     darkMode: "class",
     // ...
   };
   

2. Add a mode toggle

   Place a mode toggle on your app to toggle between light and dark mode.

   import { colorScheme, useColorScheme } from "nativewind";
   
   export function ModeToggle() {
     const { colorScheme, setColorScheme } = useColorScheme();
   
     return (
       <Button
         variant="outline"
         onClick={() => setColorScheme(colorScheme === "dark" ? "light" : "dark")}
       >
         Toggle mode
       </Button>
     )
   }
   

Reference: NativeWind docs