PDF download Download Article
Everything you need to know about this mobile Safari feature
PDF download Download Article


If you use Safari on your iPhone or iPad, you may be wondering what Website Tinting is and how you can enable or disable it. Website Tinting is a Safari app setting that affects how the websites you visit look. This setting is similar to the "Show color in compact tab bar" MacOS setting for Safari. To learn more about Website Tinting, keep reading.

Website Tinting in Safari: Overview

Website Tinting was introduced in iOS/iPadOS 15, and it allows websites to change the color of the top part of your screen while in Safari (normally, the color of this section of your screen is controlled by your theme). To enable or disable Website Tinting, go to the Safari section in your Settings app.

Section 1 of 2:

What is Website Tinting?

PDF download Download Article
  1. Introduced in iOS/iPadOS 15 [1] , Website Tinting adjusts the top bar of your iPhone or iPad's Safari browser to match the website you're on. With Website Tinting off, the top bar is a color that matches your device's theme.
    • Website Tinting is mostly for aesthetics and creating a more immersive web experience, though some users may find it easier on the eyes, depending on what website they're viewing.
    • On the other hand, some viewers may find the visual change distracting, or it could be problematic for people with color blindness or visual impairments.
    • It's also possible that Website Tinting could be causing websites to not look correct on your screen. If you're having issues viewing a website in Safari on your iPhone or iPad, check to see if Website Tinting is enabled (and disable it if so).
  2. Advertisement
Section 2 of 2:

How to Enable/Disable Website Tinting

PDF download Download Article
  1. The Settings app has a gray icon with a gear, and it's in the dock at the bottom of your screen by default.
  2. The Safari button is located a bit further down in the Settings menu, in the same section as the other iOS apps.
  3. If the toggle is green, then website tinting is enabled, and if it's gray, then the option is disabled.
  4. Advertisement

Expert Q&A

Ask a Question
      Advertisement

      Tips

      Submit a Tip
      All tip submissions are carefully reviewed before being published
      Name
      Please provide your name and last initial
      Thanks for submitting a tip for review!
      Advertisement

      About This Article

      Thanks to all authors for creating a page that has been read 4,681 times.

      Is this article up to date?

      Advertisement