# How to hide the white screen after splash screen ionic 4 and capacitor

**URL:** <https://forum.ionicframework.com/t/how-to-hide-the-white-screen-after-splash-screen-ionic-4-and-capacitor/185466>\
**Category:** Capacitor\
**Created:** [March 19, 2020, 6:07pm UTC](https://forum.ionicframework.com/t/how-to-hide-the-white-screen-after-splash-screen-ionic-4-and-capacitor/185466 "2020-03-19T18:07:33Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![youssefff](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/youssefff/32/102776_2.png) [@youssefff](https://forum.ionicframework.com/u/youssefff)\
**Post date:** [March 19, 2020, 6:07pm UTC](https://forum.ionicframework.com/t/how-to-hide-the-white-screen-after-splash-screen-ionic-4-and-capacitor/185466/1 "2020-03-19T18:07:33Z")

</div>

I’m using ionic 4 and Capacitor in my project, my problem is I get a white screen after the splash screen, I tried to edit capacitor.config.json but I still got the same problem :

```auto
"plugins": {
  "SplashScreen": {
  "launchAutoHide": false,
  "showSpinner": true,
  "androidSplashResourceName": "splash",
  "androidScaleType": "CENTER_CROP",
  "androidSpinnerStyle": "small",
  "iosSpinnerStyle": "small",
  "spinnerColor": "#ffffff",
  "backgroundColor": "#34ace0"
 }

```

is there anyone show me how to solve this problem please?

---

<div class="post-metadata">

**Author:** ![netkow](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/netkow/32/137759_2.png) [@netkow](https://forum.ionicframework.com/u/netkow)\
**Post date:** [March 21, 2020, 2:37pm UTC](https://forum.ionicframework.com/t/how-to-hide-the-white-screen-after-splash-screen-ionic-4-and-capacitor/185466/2 "2020-03-21T14:37:51Z")

</div>

White screen issues indicate a bug in your app code. See docs [here](https://ionicframework.com/docs/faq/tips#remote-debugging-ios-and-safari) on remote debugging.

Good video to review [here](https://www.youtube.com/watch?v=-kHWeZHyOaQ&t=1s) on white screen issues.

---

<div class="post-metadata">

**Author:** ![youssefff](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/youssefff/32/102776_2.png) [@youssefff](https://forum.ionicframework.com/u/youssefff)\
**Post date:** [March 27, 2020, 6:54pm UTC](https://forum.ionicframework.com/t/how-to-hide-the-white-screen-after-splash-screen-ionic-4-and-capacitor/185466/3 "2020-03-27T18:54:33Z")

</div>

Thanks for your answer but Non, my App works fine, I got my splash screen then I got the white page 4 seconds later(the white screen lasts 4 seconds or less or more then my app appears) I got my app work, I think it is a problem of webView non ?

---

<div class="post-metadata">

**Author:** ![rajnesh\_rathor](https://avatars.discourse-cdn.com/v4/letter/r/b4bc9f/32.png) [@rajnesh\_rathor](https://forum.ionicframework.com/u/rajnesh_rathor)\
**Post date:** [June 28, 2020, 11:53am UTC](https://forum.ionicframework.com/t/how-to-hide-the-white-screen-after-splash-screen-ionic-4-and-capacitor/185466/4 "2020-06-28T11:53:07Z")

</div>

Me too getting same issue. Please assist something if anyone found solution.

---

<div class="post-metadata">

**Author:** ![indraraj26](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/indraraj26/32/131213_2.png) [@indraraj26](https://forum.ionicframework.com/u/indraraj26)\
**Post date:** [June 28, 2020, 3:26pm UTC](https://forum.ionicframework.com/t/how-to-hide-the-white-screen-after-splash-screen-ionic-4-and-capacitor/185466/5 "2020-06-28T15:26:27Z")

</div>

in app.component.ts inside platform.ready  
setTimeout(() =\> {  
this.splashScreen.hide()  
}, 500)

---

<div class="post-metadata">

**Author:** ![praveenkumar6722](https://avatars.discourse-cdn.com/v4/letter/p/ce7236/32.png) [@praveenkumar6722](https://forum.ionicframework.com/u/praveenkumar6722)\
**Post date:** [July 25, 2020, 11:13am UTC](https://forum.ionicframework.com/t/how-to-hide-the-white-screen-after-splash-screen-ionic-4-and-capacitor/185466/6 "2020-07-25T11:13:12Z")

</div>

Try this it worked for me (any way small blink I can still see)

“SplashScreen”: {  
“launchShowDuration”: 3000  
}

---

<div class="post-metadata">

**Author:** ![purplecommercepC](https://avatars.discourse-cdn.com/v4/letter/p/aeb1de/32.png) [@purplecommercepC](https://forum.ionicframework.com/u/purplecommercepC)\
**Post date:** [January 13, 2021, 9:04am UTC](https://forum.ionicframework.com/t/how-to-hide-the-white-screen-after-splash-screen-ionic-4-and-capacitor/185466/7 "2021-01-13T09:04:43Z")

</div>

facing the same issue. Please help #ionicdevelopers

---

<div class="post-metadata">

**Author:** ![easyadin](https://avatars.discourse-cdn.com/v4/letter/e/ec9cab/32.png) [@easyadin](https://forum.ionicframework.com/u/easyadin)\
**Post date:** [January 13, 2021, 11:34am UTC](https://forum.ionicframework.com/t/how-to-hide-the-white-screen-after-splash-screen-ionic-4-and-capacitor/185466/8 "2021-01-13T11:34:40Z")

</div>

How I resolved it. its been a while but you can try this out.

First, tweak this or add to your capacitor.config.json

“SplashScreen”: {

```
  "launchShowDuration": 3000,

  "launchAutoHide": false,

  "androidScaleType": "CENTER_INSIDE",

  "splashFullScreen": false,

  "splashImmersive": false,

  "backgroundColor": "#1C3461",

  "androidSplashResourceName": "splash"

}

```

then use a setTimeout to hide the splash screen in your app.component.ts

```auto
 this.platform.ready().then(async () => {
     setTimeout(()=>{
        SplashScreen.hide({
          fadeOutDuration: 1000
        });
      }, 2000)
})

```

You may also need to change the launcher background and relevant styles to colour in android studio  
android\app\src\main\res\values\ic\_launcher\_background.xml  
android\app\src\main\res\values\styles.xml

Good luck.

---

<div class="post-metadata">

**Author:** ![megatron404](https://avatars.discourse-cdn.com/v4/letter/m/c67d28/32.png) [@megatron404](https://forum.ionicframework.com/u/megatron404)\
**Post date:** [August 9, 2021, 9:20pm UTC](https://forum.ionicframework.com/t/how-to-hide-the-white-screen-after-splash-screen-ionic-4-and-capacitor/185466/9 "2021-08-09T21:20:48Z")

</div>

Thank you! This worked for me.

For those using react, use `document.addEventListener("deviceready", () => {` instead of `this.platform.ready()`

---

<div class="post-metadata">

**Author:** ![msamyashash](https://avatars.discourse-cdn.com/v4/letter/m/51bf81/32.png) [@msamyashash](https://forum.ionicframework.com/u/msamyashash)\
**Post date:** [June 8, 2022, 9:16am UTC](https://forum.ionicframework.com/t/how-to-hide-the-white-screen-after-splash-screen-ionic-4-and-capacitor/185466/10 "2022-06-08T09:16:35Z")

</div>

THANK YOU! That Worked