Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.
-webkit-tap-highlight-color is a non-standard CSS property that sets the color of the highlight that appears over a link while it's being tapped. The highlighting indicates to the user that their tap is being successfully recognized, and indicates which element they're tapping on.
-webkit-tap-highlight-color: red; -webkit-tap-highlight-color: transparent; /* for removing the highlight */ /* Global values */ -webkit-tap-highlight-color: inherit; -webkit-tap-highlight-color: initial; -webkit-tap-highlight-color: revert; -webkit-tap-highlight-color: revert-layer; -webkit-tap-highlight-color: unset;
A <color>.
| Initial value | black |
|---|---|
| Applies to | all elements |
| Inherited | yes |
| Computed value | as specified |
| Animation type | discrete |
-webkit-tap-highlight-color =
<color>
Not part of any standard. Apple has a description in the Safari Web Content Guide.
| Desktop | Mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | WebView Android | WebView on iOS | |
-webkit-tap-highlight-color |
16 | 12 | No | 15 | No | 18 | No | 14 | 4 | 1.0 | 4.4 | 4 |
© 2005–2025 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-tap-highlight-color