How to make a flexible playstore app Icon that supports both "Normal Mode" and "Dark Mode"

Question

I have recently pushed a React Native app to playstore and used an Icon to represent in playstore.When Dark Mode is enabled my app's playstore Icon's background turns black which makes Icon ugly. Now my doubt is

1. Do I have to use white background for Icon for all the future apps?

OR

2. Is there any way to make our Icon to be flexible in both Normal Mode and Dark Mode?

Answer 1

regarding your first question if the issue is only inside of playstore I think light background will not hurt. I dont think google play store offers a way to make this adaptive on their website.

regarding the second one, yes! inside your android project you can place alternative versions of your launcher icon inside of /res/mipmap-night-** resource folder btw it is possible you will need to create it. And also I recommend you actually create /res/mipmap-night-hdpi, /res/mipmap-night-xhdpi etc. to take into account the different screen resolutions. Since you are developing with react you would have to dive into your android project to find the res folder, or alternatively open your project in android studio and you will see it right away. this should change how your app looks on your users home screen

UPDATE by mistake I had pointed to the drawable-night-** folders in my answer but Launcher icons in android are actually saved in the mipmap folders. I have now corrected this. I also tryed it out and it works (however I had to restart my device for it to take effect. asuming your users dont switch constantly between day and night mode they will always se the right icon for them)