Generate PWA
Web Features
Pointing Device

Keyboard & Mouse

Detect when the user is using a mouse, keyboard or touch screen as they primary mode of interaction with your app.

Pointing Device Logo

How it works

CSS4's Interaction Media queries let web applications adapt their layout and interactions based on the user's input type. For example, it allows detecting whether the pointer is fine, coarse, or absent, and whether hover is possible to adjust interface size and behavior accordingly.

  • @media (pointer: fine) → the device has a precise pointer, e.g. mouse or trackpad
  • @media (pointer: coarse) → the device uses a touch screen with no precise input
  • @media (pointer: none) → the device has no pointer or only keyboard input

Code

Your app here

Ready to generate your PWA?

Try our PWA toolkit free of charge and without limits for 14 days. No credit card required.

Generate PWA See plans