Skip to Content
DocumentationHooksuseIsTouchDevice

useIsTouchDevice

A hook that detects whether the current device supports touch input. Perfect for implementing touch-specific features and responsive interactions.

Parameters

This hook doesn’t take any parameters.

Returns

  • boolean - True if the device supports touch input, false otherwise

Usage

import { useIsTouchDevice } from '@rhinolabs/react-hooks'; function InteractiveComponent() { const isTouchDevice = useIsTouchDevice(); return ( <div> {isTouchDevice ? ( <div className="touch-controls"> <button>Tap to Interact</button> </div> ) : ( <div className="mouse-controls"> <button>Click to Interact</button> <div className="hover-tooltip">Hover for more info</div> </div> )} </div> ); }

Notes

  • Detects touch capability reliably
  • Updates on window resize
  • Checks multiple touch APIs
  • Handles device changes
  • Cleans up event listeners
  • Works across browsers
  • Real-time detection
  • Efficient resize handling
Last updated on