Website Tinting in Safari: What it Does & How to Turn it On or Off

Download Article

Everything you need to know about this mobile Safari feature

Co-authored by Hannah Dillon Reviewed by Luigi Oppido

Last Updated: April 23, 2024 Fact Checked

Download Article

• What is Website Tinting?
|
• How to Enable/Disable Website Tinting
|
• Tips

|Show more |Show less

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.

Steps

Section 1 of 2:

What is Website Tinting?

Download Article

1. Website Tinting changes the color of Safari's top bar on your iPhone/iPad. Introduced in iOS/iPadOS 15, 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).
Advertisement

Section 2 of 2:

How to Enable/Disable Website Tinting

Download Article

1. 1
   Open your Settings app. 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. 2
   Scroll down and tap Safari. The Safari button is located a bit further down in the Settings menu, in the same section as the other iOS apps.
3. 3
   Tap the toggle for Allow Website Tinting under the Tabs header. If the toggle is green, then website tinting is enabled, and if it's gray, then the option is disabled.
Advertisement

Expert Q&A

Search

Add New Question

Ask a Question

200 characters left

Include your email address to get a message when this question is answered.

Submit

Advertisement

Tips

• Website Tinting is only available on the iPhone/iPad version of Safari.
  Thanks

  Helpful 0 Not Helpful 0

Submit a Tip

All tip submissions are carefully reviewed before being published

Name

Please provide your name and last initial

Submit

Thanks for submitting a tip for review!

Advertisement