We're looking for a user researcher to understand the needs of developers and designers. Is this you or someone you know? Check out the post: https://mzl.la/2IGzdXS

The pointer CSS media feature can be used to test whether the user's primary input mechanism is a pointing device, and if so, how accurate it is.

Syntax

The pointer feature is specified as a keyword value chosen from the list below.

none
The primary input mechanism does not include a pointing device.
coarse
The primary input mechanism includes a pointing device of limited accuracy.
fine
The primary input mechanism includes an accurate pointing device.

Example

HTML

<input id="test" type="checkbox" />
<label for="test">Look at me!</label>

CSS

input[type="checkbox"]:checked {
  background: gray;
}

@media (pointer: fine) {
  input[type="checkbox"] {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    width: 15px;
    height: 15px;
    border: 1px solid blue;
  }
}

@media (pointer: coarse) {
  input[type="checkbox"] {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    width: 30px;
    height: 30px;
    border: 2px solid red;
  }
}

Result

Specifications

Specification Status Comment
Media Queries Level 4
The definition of 'pointer' in that specification.
Candidate Recommendation Initial definition.

Browser compatibility

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

Feature Chrome Firefox (Gecko) Edge Internet Explorer Opera Safari
Basic support 41 No support[2] 20 or earlier (12) ? 28 9.0 [1]
Feature Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support No support 50 No support[2] 36 ? 9.2

[1]: Implemented in WebKit bug #134822.

[2]: bug 1035774 – Implement Interaction Media Features including pointer:coarse that replaces non-standard -moz-touch-enabled

See also

Document Tags and Contributors

Last updated by: mfluehr,