diff --git a/web/src/lib/device.ts b/web/src/lib/device.ts
index 42f19aa5..90831386 100644
--- a/web/src/lib/device.ts
+++ b/web/src/lib/device.ts
@@ -11,7 +11,6 @@ const device = {
         iPhone: false,
         iPad: false,
         iOS: false,
-        modernIOS: false,
         android: false,
         mobile: false,
     },
@@ -26,6 +25,7 @@ const device = {
     supports: {
         share: false,
         directDownload: false,
+        haptics: false,
     },
     userAgent: "sveltekit server",
 }
@@ -55,7 +55,6 @@ if (browser) {
         iPhone,
         iPad,
         iOS,
-        modernIOS,
     };
 
     device.browser = {
@@ -71,6 +70,10 @@ if (browser) {
     device.supports = {
         share: navigator.share !== undefined,
         directDownload: !(installed && iOS),
+
+        // not sure if vibrations feel the same on android,
+        // so they're enabled only on ios 18+ for now
+        haptics: modernIOS,
     };
 
     device.userAgent = navigator.userAgent;
diff --git a/web/src/lib/haptics.ts b/web/src/lib/haptics.ts
index 4b8d9026..347e81bc 100644
--- a/web/src/lib/haptics.ts
+++ b/web/src/lib/haptics.ts
@@ -1,11 +1,13 @@
+import { get } from "svelte/store";
 import { device } from "$lib/device";
+import settings from "$lib/state/settings";
 
-// not sure if vibrations feel the same on android,
-// so they're enabled only on ios 18+ for now
-const useHaptics = device.is.modernIOS;
+const canUseHaptics = () => {
+    return device.supports.haptics && !get(settings).appearance.disableHaptics;
+}
 
 export const hapticSwitch = () => {
-    if (!useHaptics) return;
+    if (!canUseHaptics()) return;
 
     try {
         const label = document.createElement("label");
@@ -26,7 +28,7 @@ export const hapticSwitch = () => {
 }
 
 export const hapticConfirm = () => {
-    if (!useHaptics) return;
+    if (!canUseHaptics()) return;
 
     hapticSwitch();
     setTimeout(() => hapticSwitch(), 120);