Some web browsers, notably on smartphones, let web developers specify a colour that will be used to decline the tints of the web browser header and title bar as well as the smartphone status bar. The following StackOverflow comment provides code samples on how to achieve that.
Here is the XenForo template you should edit:
Admin Control Panel / Appearance / Templates / PAGE_CONTAINER
Here is what I added to mine:
Notice the favicon reference which is slightly off topic here.
Vivaldi desktop web browser also applies the specified colour.
Here is the XenForo template you should edit:
Admin Control Panel / Appearance / Templates / PAGE_CONTAINER
Here is what I added to mine:
HTML:
<!-- SL: Specify favicon and status bar colour for various browsers -->
<link rel="icon" href="/favicon.ico?v=2" />
<!-- Chrome, Firefox OS and Opera -->
<meta name="theme-color" content="@contentBackground">
<!-- Windows Phone -->
<meta name="msapplication-navbutton-color" content="@contentBackground">
<!-- iOS Safari -->
<meta name="apple-mobile-web-app-status-bar-style" content="@contentBackground">Notice the favicon reference which is slightly off topic here.
Vivaldi desktop web browser also applies the specified colour.
Last edited: