diff --git a/js/quadrilateral-main.js b/js/quadrilateral-main.js
index dcc3d824..49a90427 100644
--- a/js/quadrilateral-main.js
+++ b/js/quadrilateral-main.js
@@ -11,6 +11,7 @@ import Sim from '../../joist/js/Sim.js';
 import simLauncher from '../../joist/js/simLauncher.js';
 import { Color, ColorProperty, HBox } from '../../scenery/js/imports.js';
 import Tandem from '../../tandem/js/Tandem.js';
+import vibrationManager from '../../tappi/js/vibrationManager.js';
 import QuadrilateralSoundOptionsModel from './quadrilateral/model/QuadrilateralSoundOptionsModel.js';
 import QuadrilateralQueryParameters from './quadrilateral/QuadrilateralQueryParameters.js';
 import QuadrilateralScreen from './quadrilateral/QuadrilateralScreen.js';
@@ -70,4 +71,6 @@ simLauncher.launch( () => {
 
   const sim = new Sim( quadrilateralTitleString, simScreens, simOptions );
   sim.start();
+
+  vibrationManager.initialize( sim.browserTabVisibleProperty, sim.activeProperty );
 } );
\ No newline at end of file
diff --git a/js/quadrilateral/view/QuadrilateralScreenView.ts b/js/quadrilateral/view/QuadrilateralScreenView.ts
index f4df2d74..a1227568 100644
--- a/js/quadrilateral/view/QuadrilateralScreenView.ts
+++ b/js/quadrilateral/view/QuadrilateralScreenView.ts
@@ -35,6 +35,7 @@ import QuadrilateralMarkerInput from './QuadrilateralMarkerInput.js';
 import QuadrilateralVisibilityControls from './QuadrilateralVisibilityControls.js';
 import QuadrilateralGridNode from './QuadrilateralGridNode.js';
 import QuadrilateralScreenSummaryContentNode from './QuadrilateralScreenSummaryContentNode.js';
+import vibrationManager from '../../../../tappi/js/vibrationManager.js';
 
 const MODEL_BOUNDS = QuadrilateralQueryParameters.calibrationDemoDevice ? new Bounds2( -4.5, -4.5, 4.5, 4.5 ) :
                      new Bounds2( -1, -1, 1, 1 );
@@ -333,6 +334,8 @@ class QuadrilateralScreenView extends ScreenView {
       this.quadrilateralMarkerInput.step( dt );
     }
 
+    vibrationManager.step( dt );
+
     this.quadrilateralAlerter.step( dt );
   }
 }
diff --git a/js/quadrilateral/view/VertexNode.ts b/js/quadrilateral/view/VertexNode.ts
index d8506e98..94d114b8 100644
--- a/js/quadrilateral/view/VertexNode.ts
+++ b/js/quadrilateral/view/VertexNode.ts
@@ -134,6 +134,16 @@ class VertexNode extends Voicing( Circle, 1 ) {
       }
     } );
 
+    // vibration
+    vertex.isPressedProperty.lazyLink( isPressed => {
+      if ( isPressed ) {
+        navigator.vibrate( [ 10000 ] );
+      }
+      else {
+        navigator.vibrate( 0 );
+      }
+    } );
+
     this.mutate( options );
   }
 }
diff --git a/package.json b/package.json
index d1929fed..a6b3d280 100644
--- a/package.json
+++ b/package.json
@@ -20,7 +20,8 @@
     ],
     "phetLibs": [
       "tangible",
-      "bamboo"
+      "bamboo",
+      "tappi"
     ],
     "preload": [
       "../sherpa/lib/beholder-detection-1.1.12.js"
diff --git a/quadrilateral_en.html b/quadrilateral_en.html
index 5bde9e27..116ae314 100644
--- a/quadrilateral_en.html
+++ b/quadrilateral_en.html
@@ -42,7 +42,8 @@
         ],
         "phetLibs": [
           "tangible",
-          "bamboo"
+          "bamboo",
+          "tappi"
         ],
         "preload": [
           "../sherpa/lib/beholder-detection-1.1.12.js"
@@ -84,6 +85,10 @@
         "repo": "tambo",
         "requirejsNamespace": "TAMBO"
       },
+      {
+        "repo": "tappi",
+        "requirejsNamespace": "TAPPI"
+      },
       {
         "repo": "twixt",
         "requirejsNamespace": "TWIXT"
diff --git a/tsconfig.json b/tsconfig.json
index feff9dfb..38dc6cab 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -9,6 +9,9 @@
     },
     {
       "path": "../bamboo/tsconfig-module.json"
+    },
+    {
+      "path": "../tappi"
     }
   ],
   "include": [