How to Remove or Hide DEBUG Banner in Flutter?

To remove or hide the debug banner in your Flutter project, you can set the debugShowCheckedModeBanner value to false.

By default, the debugShowCheckedModeBanner value is set to true.

debugShowCheckedModeBanner property turns on a little “DEBUG” banner in debug mode to indicate that the app is in debug mode. This is on by default (in debug mode), to turn it off, set the constructor argument to false. In release mode, this has no effect.

flutter.dev

Here is an example of how the banner would like if you don’t set the debugShowCheckedModeBanner value to false.

Sample Code to Remove or Hide DEBUG Banner in Flutter

In your main method, set debugShowCheckedModeBanner = false as stated earlier.

void main() {
  runApp(
    MaterialApp(
      home: Splash(),
      debugShowCheckedModeBanner: false,
      title: 'Learning How to Hide Debug Banner',
      theme: ThemeData(
        fontFamily: 'DDC_Uchen'
      ),
    ),
  );
}

Here the banner gets disappeared.

In the sample code shown above, I have used the default custom font in the project. To learn how to do it refer to my post: Change Global Default Font in Flutter App