diff --git a/src/components/ThreeDice/DiceManager.js b/src/components/ThreeDice/DiceManager.js
index 4a469fd..07f4dd8 100644
--- a/src/components/ThreeDice/DiceManager.js
+++ b/src/components/ThreeDice/DiceManager.js
@@ -2,6 +2,7 @@ import React, { Suspense, useEffect, useMemo } from "react";
 import { atom, useAtom } from "jotai";
 import PropTypes from "prop-types";
 import { BoxBufferGeometry } from "three";
+import { useThree, useFrame } from "react-three-fiber";
 import { uniqueImageSet } from "../Dice/Dice";
 import ThemedDie from "./ThemedDie";
 import CollisionMesh from "./CollisionMesh";
@@ -68,6 +69,16 @@ const DiceManager = (props) => {
     setImagesTwo,
   ]);
 
+  const { viewport } = useThree();
+  const mousePos = [];
+
+  useFrame((state) => {
+    const { mouse } = state;
+    const { width, height } = viewport();
+    mousePos[0] = (mouse.x * width) / 2;
+    mousePos[1] = (mouse.y * height) / 2;
+  });
+
   return (
     <Suspense fallback={null}>
       {dicePosition.map((pos, index) => (
@@ -81,6 +92,7 @@ const DiceManager = (props) => {
           setImages={imageArray[index].setImages}
           geom={geom}
           setOrbitControl={setOrbitControl}
+          mousePos={mousePos}
         />
       ))}
       <CollisionMesh />
diff --git a/src/components/ThreeDice/ThemedDie.js b/src/components/ThreeDice/ThemedDie.js
index 17a6b51..64e9a64 100644
--- a/src/components/ThreeDice/ThemedDie.js
+++ b/src/components/ThreeDice/ThemedDie.js
@@ -1,6 +1,4 @@
-/* eslint-disable no-console */
 import React, { useEffect } from "react";
-import { useThree } from "react-three-fiber";
 import { useTexture } from "@react-three/drei";
 import { useBox } from "@react-three/cannon";
 import PropTypes from "prop-types";
@@ -23,8 +21,8 @@ const ThemedDie = (props) => {
     setImages,
     geom,
     setOrbitControl,
+    mousePos,
   } = props;
-  // const [pos, setPos] = useState(diePos);
   const textures = useTexture([...imageSet]);
 
   const [mesh, api] = useBox(() => ({
@@ -40,32 +38,36 @@ const ThemedDie = (props) => {
     material: { restitution: 0.3 },
   }));
 
-  const { size, viewport } = useThree();
-  const aspect = size.width / viewport.width;
   const isDragging = React.useRef(false);
 
   const clickBind = useGesture({
     onClick: () => {
-      if (isDragging.current) return;
-      rerollDieToggle(!rerollValue);
-      singleRollSound();
+      if (!isDragging.current) {
+        rerollDieToggle(!rerollValue);
+        singleRollSound();
+      }
     },
   });
 
   const dragBind = useDrag(
-    ({ offset: [x, y], first, last }) => {
+    ({ first, last }) => {
       if (first) {
         setOrbitControl(false);
         isDragging.current = true;
+        api.mass.set(0);
+        api.collisionResponse.set(0);
       } else if (last) {
-        isDragging.current = false;
+        // eslint-disable-next-line no-return-assign
+        setTimeout(() => (isDragging.current = false), 100);
         setOrbitControl(true);
+        api.mass.set(300);
+        api.collisionResponse.set(1);
       }
-      api.position.set(x / aspect, 1.5, y / aspect);
+      api.position.set(mousePos[0], 2, -mousePos[1]);
     },
     {
-      threshold: 1,
-      delay: 1000,
+      initial: () => [mousePos[0], mousePos[1]],
+      filterTaps: true,
     }
   );
 
@@ -116,6 +118,7 @@ ThemedDie.propTypes = {
   rerollDieToggle: PropTypes.func.isRequired,
   geom: PropTypes.shape().isRequired,
   setOrbitControl: PropTypes.func.isRequired,
+  mousePos: PropTypes.arrayOf(PropTypes.number).isRequired,
 };
 
 export default ThemedDie;