How can I change the top bar color of my website in Safari?

Edited

Safari uses the theme color meta tag to determine the top bar color of your website. By design, the theme is configured to use the button color under Theme settings > Colors > General for this section.

If you want to assign a separate color, you can do so by editing the theme code. First, open the code editor by clicking the ... button > Edit code.

Open the theme.liquid file in your Layout folder and look for the following code:

<meta name="theme-color" content="{{ settings.color_button }}">

Replace {{ settings.color_button }} with the HTML color name or hex code that you want. For example:

<meta name="theme-color" content="#5F9EA0">