Would you like to change your status bar color ionic app

Finally found the solution after days of searching

just follow this step you can get bg color in your app

Make sure you have Ionic CLI configured on your system, then execute the following command to install Ionic project:

Install the Cordova and Ionic Native plugins: 1.npm install --save @ionic-native/status

1. put in your src-Cordova

then go to your config.xml file just copy paste these cmd

Set the status bar to a specific hex color (CSS shorthand supported!).

here styleDefault() Use the default status bar (dark text, for light backgrounds).

hexString string The hex value of the color.

Change Ionic Status Bar Color

Changing the color of the status bar can be done through two methods,

You can define color by name using backgroundColorByName() method. It takes color name as a parameter, here are the supported color names:

black, darkGray, lightGray, white, gray, red, green, blue, cyan, yellow, magenta, orange, purple, brown

Apart from color names, you can also use hex values to change the color of the status bar.

here is the code how to put a color in config.xml

Make the Status Bar overlay in Ionic

The overlaysWebView() method makes the status bar overlay or not overlay the WebView. Set to true to make the statusbar overlay on top of your app.

E.g ()

Ensure that you adjust your styling accordingly not to cover your app’s title bar or content. If configured to false, then it makes the status bar solid not only but also not overlay your app.