Dark and Light Mode in Flutter

Dark and Light Mode in Flutter — a practical guide to Flutter dark light mode with clear examples you can reuse in real projects.

Flutter Tutorial Series (57/107). Prefer one article? Read the complete Flutter tutorial.

Short description

Persist user preference and listen to platform brightness when using system mode.

themeMode

MaterialApp(
  themeMode: ThemeMode.system,
  theme: ThemeData.light(useMaterial3: true),
  darkTheme: ThemeData.dark(useMaterial3: true),
);