How to remove the blue frame after clicking in Safari?

Picture of Ondřej Koziorek
Ondřej Koziorek

How do I remove the blue box that appears when I click on a link in Safari? (menus, arrows, etc.)

This is an outline. It provides visual feedback for links that have "focus" when navigating through a web document using the TAB key (or equivalent key). This is especially useful for people who cannot use a mouse or have a visual impairment. If you remove this outline, you make your site inaccessible to these people.

Defining the focus on navigation elements is an accessibility requirement, it is stated in the Web Content Accessibility Guidelines.

More information can be found here: https://outlinenone.com/

Therefore, be cautious with its removal. If you still want to remove it, you can find the code below.

Demonstration

blue safari frame after clicking

The code you paste into Customize > CSS

				
					* {
-webkit-tap-highlight-color: rgba(255, 255, 0) !important;
-webkit-focus-ring-color: rgba(255, 255, 255, 0) !important;
outline: none !important;
}