Ionic Vue PWA – ios status bar color


I am developing a PWA using Ionic Vue.
How can I change the color of the status bar in iOS?

I read this doc and tried writing theme-color Meta in the <template> tag, but it didn’t change the color.

    <meta name="theme-color" media="(prefers-color-scheme: light)" content="#3880ff" />
    <meta name="theme-color" media="(prefers-color-scheme: dark)" content="#eb445a" />


I solved by changing Safari status bar color with theme-color meta in index.html.

  <meta name="theme-color" content="#051829" />

Answered By – kusumoto_teruya

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply

(*) Required, Your email will not be published