Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Does CSS -webkit-tap-highlight-color: transparent; have accessibility implications?

Does this CSS code have negative accessibility implications?

-webkit-tap-highlight-color: transparent;

I'm not an expert but I understand some people have difficulty seeing certain colors and I'm just bothered that if I remove the type highlight color it may affect them(I want to remove it because it makes the UI look weird when tapped).

I have committed to writing my web pages as accessible as possible so before I disable anything need to know the implications, and yes I'm new to this.

like image 314
Adavize Aliyu Avatar asked Oct 13 '25 06:10

Adavize Aliyu


1 Answers

There are no accessibility requirements in WCAG that require the use of -webkit-tap-highlight-color.

If you don't have cursor:pointer set, then you can remove -webkit-tap-highlight-color and it won't affect anything.

-webkit-tap-highlight-color is commonly used to override the default styles of webkit browsers (Chrome, Safari, Edge) when an element that has cursor:pointer is tapped from a mobile device.

The default behavior is that any element (or containing element) that has cursor:pointer explicitly set and is clicked will flash blue momentarily. You can bypass the entire issue by ensuring that cursor:pointer is not set.

like image 115
Josh Avatar answered Oct 15 '25 02:10

Josh