diff --git a/package-lock.json b/package-lock.json
index c663c82..1032a15 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -21,6 +21,7 @@
         "react-icons": "^4.4.0",
         "react-router-dom": "^6.3.0",
         "react-scripts": "5.0.1",
+        "use-sound": "^4.0.1",
         "web-vitals": "^2.1.4"
       }
     },
@@ -9737,6 +9738,11 @@
         "node": ">=10"
       }
     },
+    "node_modules/howler": {
+      "version": "2.2.3",
+      "resolved": "https://registry.npmjs.org/howler/-/howler-2.2.3.tgz",
+      "integrity": "sha512-QM0FFkw0LRX1PR8pNzJVAY25JhIWvbKMBFM4gqk+QdV+kPXOhleWGCB6AiAF/goGjIHK2e/nIElplvjQwhr0jg=="
+    },
     "node_modules/hpack.js": {
       "version": "2.1.6",
       "resolved": "https://registry.npmjs.org/hpack.js/-/hpack.js-2.1.6.tgz",
@@ -18282,6 +18288,17 @@
         "punycode": "^2.1.0"
       }
     },
+    "node_modules/use-sound": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/use-sound/-/use-sound-4.0.1.tgz",
+      "integrity": "sha512-hykJ86kNcu6y/FzlSHcQxhjSGMslZx2WlfLpZNoPbvueakv4OF3xPxEtGV2YmculrIaH0tPp9LtG4jgy17xMWg==",
+      "dependencies": {
+        "howler": "^2.1.3"
+      },
+      "peerDependencies": {
+        "react": ">=16.8"
+      }
+    },
     "node_modules/util-deprecate": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
@@ -26360,6 +26377,11 @@
         "lru-cache": "^6.0.0"
       }
     },
+    "howler": {
+      "version": "2.2.3",
+      "resolved": "https://registry.npmjs.org/howler/-/howler-2.2.3.tgz",
+      "integrity": "sha512-QM0FFkw0LRX1PR8pNzJVAY25JhIWvbKMBFM4gqk+QdV+kPXOhleWGCB6AiAF/goGjIHK2e/nIElplvjQwhr0jg=="
+    },
     "hpack.js": {
       "version": "2.1.6",
       "resolved": "https://registry.npmjs.org/hpack.js/-/hpack.js-2.1.6.tgz",
@@ -32477,6 +32499,14 @@
         "punycode": "^2.1.0"
       }
     },
+    "use-sound": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/use-sound/-/use-sound-4.0.1.tgz",
+      "integrity": "sha512-hykJ86kNcu6y/FzlSHcQxhjSGMslZx2WlfLpZNoPbvueakv4OF3xPxEtGV2YmculrIaH0tPp9LtG4jgy17xMWg==",
+      "requires": {
+        "howler": "^2.1.3"
+      }
+    },
     "util-deprecate": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
diff --git a/package.json b/package.json
index 7034cd5..f29b632 100644
--- a/package.json
+++ b/package.json
@@ -16,6 +16,7 @@
     "react-icons": "^4.4.0",
     "react-router-dom": "^6.3.0",
     "react-scripts": "5.0.1",
+    "use-sound": "^4.0.1",
     "web-vitals": "^2.1.4"
   },
   "scripts": {
diff --git a/src/components/BottomInputComponent.js b/src/components/BottomInputComponent.js
index 478fe5d..230bd52 100644
--- a/src/components/BottomInputComponent.js
+++ b/src/components/BottomInputComponent.js
@@ -6,6 +6,9 @@ import { BsFillArrowUpSquareFill } from "react-icons/bs"
 import Container from "react-bootstrap/Container"
 import Navbar from "react-bootstrap/Navbar"
 import { ThemeContext } from "../context.js"
+// import use-sound React hook for sound effects
+import useSound from "use-sound"
+import buttonSound from "../sounds/stories_sounds_boop.mp3"
 
 function BottomInputComponent({ currentUser, isFocused }) {
   const [message, setMessage] = useState("")
@@ -38,6 +41,7 @@ function BottomInputComponent({ currentUser, isFocused }) {
       console.error("Error writing new message to Firebase Database", error)
     }
   }
+
   //  ========================================================
   // add character limit & prevent page reload on space submission
   //  ========================================================
@@ -48,9 +52,12 @@ function BottomInputComponent({ currentUser, isFocused }) {
       e.preventDefault()
       saveMessage(message)
       setMessage("")
+      buttonSfx()
     }
   }
 
+  const [buttonSfx] = useSound(buttonSound)
+
   // Perform focus on input field's element via the DOM API when component renders/dependency changes
   // (imperative approach)
   const inputRef = React.useRef()
diff --git a/src/components/TopNavigationBar.js b/src/components/TopNavigationBar.js
index 3ae5a73..ecb2525 100644
--- a/src/components/TopNavigationBar.js
+++ b/src/components/TopNavigationBar.js
@@ -9,9 +9,13 @@ import "./TopNavigationBar.css"
 import { ThemeContext } from "../context.js"
 import { useContext } from "react"
 import UserLogo from "../assets/sparrow-user-profile.svg"
+import useSound from "use-sound"
+import toggleSound from "../sounds/stories_sounds_switch-off.mp3"
 
 function TopNavigationBar({ currentUser }) {
   const { toggle } = useContext(ThemeContext)
+  const [toggleSfx] = useSound(toggleSound)
+
   // When signing out removes user from 'users' collection and signs out user.
   const handleSignOutUser = () => {
     removeUser(currentUser)
@@ -52,7 +56,14 @@ function TopNavigationBar({ currentUser }) {
             </Button>
           </Link>
 
-          <button onClick={toggle}>Theme</button>
+          <button
+            onClick={() => {
+              toggle()
+              toggleSfx()
+            }}
+          >
+            Theme
+          </button>
         </Container>
       </Navbar>
     </div>
diff --git a/src/context.js b/src/context.js
index 3a252eb..fedc805 100644
--- a/src/context.js
+++ b/src/context.js
@@ -35,8 +35,6 @@ function ThemeContextProvider({ children }) {
     setLight(isLight)
   }, [light])
 
-  useEffect(() => {}, [])
-
   const toggle = () => {
     const isLight = !light
     //saves state
diff --git a/src/sounds/arcade-button.mp3 b/src/sounds/arcade-button.mp3
new file mode 100644
index 0000000..aaee599
Binary files /dev/null and b/src/sounds/arcade-button.mp3 differ
diff --git a/src/sounds/beep-error.mp3 b/src/sounds/beep-error.mp3
new file mode 100644
index 0000000..ab924a4
Binary files /dev/null and b/src/sounds/beep-error.mp3 differ
diff --git a/src/sounds/login.mp3 b/src/sounds/login.mp3
new file mode 100644
index 0000000..b953699
Binary files /dev/null and b/src/sounds/login.mp3 differ
diff --git a/src/sounds/logout.mp3 b/src/sounds/logout.mp3
new file mode 100644
index 0000000..960f27f
Binary files /dev/null and b/src/sounds/logout.mp3 differ
diff --git a/src/sounds/stories_sounds_boop.mp3 b/src/sounds/stories_sounds_boop.mp3
new file mode 100644
index 0000000..709d808
Binary files /dev/null and b/src/sounds/stories_sounds_boop.mp3 differ
diff --git a/src/sounds/stories_sounds_switch-off.mp3 b/src/sounds/stories_sounds_switch-off.mp3
new file mode 100644
index 0000000..1396c96
Binary files /dev/null and b/src/sounds/stories_sounds_switch-off.mp3 differ