hapticly

One call for a real haptic tap on the web. haptic() detects the platform: the iOS system tap via the switch trick, and the Vibration API on Android.

Install

npm i hapticly

Quick start

The reliable way is to bind haptics to the element the user taps:

import haptic from "hapticly";

const button = document.querySelector("button");
haptic.attach(button);

On Android you can also fire it programmatically:

haptic();                         // a short tap
haptic([45, 50, 45]);             // a custom pattern
haptic(haptic.patterns.success);  // a named pattern

Why you attach on iOS

iOS gives the web no vibration API. The only thing it exposes is the system tap that plays when an <input switch> is toggled by a real finger touch. So on iOS haptics must be tied to the element the user actually touches. A tap fired purely from JavaScript is ignored. attach() overlays an invisible switch on your element to make this work.

What each platform can do

• Android. Real durations and patterns through navigator.vibrate. Needs a secure context (https).
• iOS. One fixed tap. Intensity, duration and patterns cannot be varied, so every haptic feels the same. It must come from a real touch, so use attach.
• Desktop. No vibration hardware, so calls return false and do nothing.

API

• haptic(pattern?) fire a tap. pattern is a duration in ms or an [on, off, ...] array. The pattern detail only applies on Android.
• haptic.attach(el, pattern?) bind haptics to el. Returns a cleanup function. This is the recommended path for iOS.
• haptic.isSupported() true if the device can produce feedback.
• haptic.stop() cancel an ongoing Android vibration.
• haptic.patterns named Android patterns: tap, success, warning, error.

Caveats

• Must run inside a user gesture. Browsers block feedback on page load.
• The iOS trick relies on undocumented behavior, so Apple can change it. Verified on Safari 17.4 and on iOS 26.6.1 (iPhone 17 Pro). Test on your target devices.

License

MIT