diff --git a/desktop/app.js b/desktop/app.js
index 575529f..a0d5a5a 100644
--- a/desktop/app.js
+++ b/desktop/app.js
@@ -417,13 +417,10 @@ function renderChannels() {
           if (p.user_id !== state.me.id) {
             const vol = state.userVolumes.get(p.user_id) ?? 1.0;
             sliderHtml = `
-              <div class="user-volume-control" style="width: 100%; display: flex; align-items: center; gap: 8px; padding-left: 28px; margin-top: 2px;">
+              <div class="user-volume-control" data-user-id="${p.user_id}">
                 <i data-lucide="volume-2" style="width: 12px; height: 12px; opacity: 0.6;"></i>
-                <input type="range" min="0" max="2" step="0.1" value="${vol}" 
-                  class="volume-slider" 
-                  data-user-id="${p.user_id}"
-                  style="flex: 1; height: 4px; cursor: pointer;">
-                <span class="vol-pct" style="font-size: 10px; opacity: 0.6; min-width: 25px;">${Math.round(vol * 100)}%</span>
+                <input type="range" min="0" max="2" step="0.1" value="${vol}" class="volume-slider">
+                <span class="vol-pct">${Math.round(vol * 100)}%</span>
               </div>
             `;
           }
@@ -453,6 +450,16 @@ function renderChannels() {
             slider.addEventListener('click', (e) => e.stopPropagation());
           }
 
+          // Show slider on right click
+          pRow.addEventListener('contextmenu', (e) => {
+            if (p.user_id === state.me.id) return;
+            e.preventDefault();
+            const control = pRow.querySelector('.user-volume-control');
+            if (control) {
+              control.classList.toggle('show-volume');
+            }
+          });
+
           pList.appendChild(pRow);
         }
         el.voiceChannelList.appendChild(pList);
diff --git a/desktop/styles.css b/desktop/styles.css
index 70cca56..5d4e40a 100644
--- a/desktop/styles.css
+++ b/desktop/styles.css
@@ -563,11 +563,42 @@ select {
   vertical-align: text-bottom;
 }
 
+.user-volume-control {
+  width: 100%;
+  display: none;
+  /* Hidden by default */
+  align-items: center;
+  gap: 8px;
+  padding: 4px 8px 4px 28px;
+  margin-top: 2px;
+  box-sizing: border-box;
+  background: rgba(0, 0, 0, 0.2);
+  border-radius: 4px;
+  overflow: hidden;
+}
+
+.user-volume-control.show-volume {
+  display: flex;
+  /* Show when active */
+}
+
 .volume-slider {
   -webkit-appearance: none;
+  appearance: none;
   background: var(--bg-darker);
   border-radius: 2px;
   outline: none;
+  flex: 1;
+  height: 4px;
+  cursor: pointer;
+  min-width: 0;
+}
+
+.vol-pct {
+  font-size: 10px;
+  opacity: 0.6;
+  min-width: 30px;
+  text-align: right;
 }
 
 .volume-slider::-webkit-slider-thumb {
diff --git a/static/app.js b/static/app.js
index 24e12b1..c07063f 100644
--- a/static/app.js
+++ b/static/app.js
@@ -372,13 +372,10 @@ function renderChannels() {
           if (p.user_id !== state.me.id) {
             const vol = state.userVolumes.get(p.user_id) ?? 1.0;
             sliderHtml = `
-              <div class="user-volume-control" style="width: 100%; display: flex; align-items: center; gap: 8px; padding-left: 28px; margin-top: 2px;">
+              <div class="user-volume-control" data-user-id="${p.user_id}">
                 <i data-lucide="volume-2" style="width: 12px; height: 12px; opacity: 0.6;"></i>
-                <input type="range" min="0" max="2" step="0.1" value="${vol}" 
-                  class="volume-slider" 
-                  data-user-id="${p.user_id}"
-                  style="flex: 1; height: 4px; cursor: pointer;">
-                <span class="vol-pct" style="font-size: 10px; opacity: 0.6; min-width: 25px;">${Math.round(vol * 100)}%</span>
+                <input type="range" min="0" max="2" step="0.1" value="${vol}" class="volume-slider">
+                <span class="vol-pct">${Math.round(vol * 100)}%</span>
               </div>
             `;
           }
@@ -408,6 +405,16 @@ function renderChannels() {
             slider.addEventListener('click', (e) => e.stopPropagation());
           }
 
+          // Show slider on right click
+          pRow.addEventListener('contextmenu', (e) => {
+            if (p.user_id === state.me.id) return;
+            e.preventDefault();
+            const control = pRow.querySelector('.user-volume-control');
+            if (control) {
+              control.classList.toggle('show-volume');
+            }
+          });
+
           pList.appendChild(pRow);
         }
         el.voiceChannelList.appendChild(pList);
diff --git a/static/styles.css b/static/styles.css
index 59fd145..9147a37 100644
--- a/static/styles.css
+++ b/static/styles.css
@@ -584,11 +584,42 @@ select {
   vertical-align: text-bottom;
 }
 
+.user-volume-control {
+  width: 100%;
+  display: none;
+  /* Hidden by default */
+  align-items: center;
+  gap: 8px;
+  padding: 4px 8px 4px 28px;
+  margin-top: 2px;
+  box-sizing: border-box;
+  background: rgba(0, 0, 0, 0.2);
+  border-radius: 4px;
+  overflow: hidden;
+}
+
+.user-volume-control.show-volume {
+  display: flex;
+  /* Show when active */
+}
+
 .volume-slider {
   -webkit-appearance: none;
+  appearance: none;
   background: var(--bg-darker);
   border-radius: 2px;
   outline: none;
+  flex: 1;
+  height: 4px;
+  cursor: pointer;
+  min-width: 0;
+}
+
+.vol-pct {
+  font-size: 10px;
+  opacity: 0.6;
+  min-width: 30px;
+  text-align: right;
 }
 
 .volume-slider::-webkit-slider-thumb {