diff --git a/website/src/repl/components/panel/SettingsTab.jsx b/website/src/repl/components/panel/SettingsTab.jsx
index e78903e56..baa5506ba 100644
--- a/website/src/repl/components/panel/SettingsTab.jsx
+++ b/website/src/repl/components/panel/SettingsTab.jsx
@@ -167,10 +167,7 @@ export function SettingsTab({ started }) {
         )}
         <NumberSlider
           value={audioVolume}
-          onChange={(audioVolume) => {
-            settingsMap.setKey('audioVolume', audioVolume);
-            setGlobalAudioVolume(audioVolume);
-          }}
+          onChange={(audioVolume) => settingsMap.setKey('audioVolume', audioVolume)}
           min={0}
           max={100}
           step={0.1}
diff --git a/website/src/repl/useReplContext.jsx b/website/src/repl/useReplContext.jsx
index 19a95acd2..04d300412 100644
--- a/website/src/repl/useReplContext.jsx
+++ b/website/src/repl/useReplContext.jsx
@@ -159,11 +159,10 @@ export function useReplContext() {
     editorRef.current?.updateSettings(editorSettings);
   }, [_settings]);
 
-  // on first load...
+  // on first load, set stored audio device if possible
   useEffect(() => {
-    const { audioDeviceName, audioVolume } = _settings;
+    const { audioDeviceName } = _settings;
 
-    // set stored audio device if possible
     if (audioDeviceName !== defaultAudioDeviceName) {
       getAudioDevices().then((devices) => {
         const deviceID = devices.get(audioDeviceName);
@@ -173,11 +172,11 @@ export function useReplContext() {
         setAudioDevice(deviceID);
       });
     }
-
-    // set stored audio volume
-    setGlobalAudioVolume(audioVolume);
   }, []);
 
+  // set stored audio volume
+  useEffect(() => setGlobalAudioVolume(_settings.audioVolume), [_settings.audioVolume]);
+
   //
   // UI Actions
   //