diff --git a/content/sv/status/index.md b/content/sv/status/index.md
index 1642950..b4a8910 100644
--- a/content/sv/status/index.md
+++ b/content/sv/status/index.md
@@ -48,6 +48,16 @@ Kanalutnyttjande (Channel Utilization) visar hur mycket av radiokanalen som är
     </div>
   </div>
 </div>
+<div class="btn-group btn-group-sm mb-1" role="group" aria-label="Channel utilization period">
+  <input type="radio" class="btn-check" name="chUtilPeriod" id="chUtil7" value="7" autocomplete="off" checked>
+  <label class="btn btn-outline-primary" for="chUtil7">7 dagar</label>
+  <input type="radio" class="btn-check" name="chUtilPeriod" id="chUtil14" value="14" autocomplete="off">
+  <label class="btn btn-outline-primary" for="chUtil14">14 dagar</label>
+  <input type="radio" class="btn-check" name="chUtilPeriod" id="chUtil30" value="30" autocomplete="off">
+  <label class="btn btn-outline-primary" for="chUtil30">30 dagar</label>
+  <input type="radio" class="btn-check" name="chUtilPeriod" id="chUtil60" value="60" autocomplete="off">
+  <label class="btn btn-outline-primary" for="chUtil60">60 dagar</label>
+</div>
 <div id="channelUtilizationContainer" class="stats-chart-container" style="min-height:300px;">
     <canvas id="channelUtilizationChart"></canvas>
 </div>
diff --git a/static/js/status/channel-utilization.js b/static/js/status/channel-utilization.js
index d28cfc4..1af9fe6 100644
--- a/static/js/status/channel-utilization.js
+++ b/static/js/status/channel-utilization.js
@@ -1,7 +1,15 @@
-async function channelUtilizationHourlyAverage() {
+let chUtilChart = null;
+
+async function channelUtilizationHourlyAverage(days = 7) {
   const canvas = document.getElementById('channelUtilizationChart');
   const ctx = canvas.getContext('2d');
 
+  // Destroy existing chart if any
+  if (chUtilChart) {
+    chUtilChart.destroy();
+    chUtilChart = null;
+  }
+
   // show loading
   ctx.font = '16px Arial';
   ctx.fillStyle = 'gray';
@@ -9,8 +17,7 @@ async function channelUtilizationHourlyAverage() {
   ctx.fillText('Loading...', canvas.width/2, canvas.height/2);
 
   try {
-    // Fetch data for MediumFast over the last 7 days
-    const response = await fetch('https://map.sthlm-mesh.se/api/v1/stats/channel-utilization-stats?days=7&channel_id=MediumFast');
+    const response = await fetch(`https://map.sthlm-mesh.se/api/v1/stats/channel-utilization-stats?days=${days}&channel_id=MediumFast`);
     const allData = await response.json();
 
     // Single dataset containing all points
@@ -32,7 +39,7 @@ async function channelUtilizationHourlyAverage() {
       fill: false,
     });
 
-    new Chart(ctx, {
+    chUtilChart = new Chart(ctx, {
       type: 'line',
       data: {
         datasets: datasets
@@ -95,4 +102,8 @@ async function channelUtilizationHourlyAverage() {
 
 }
 
+document.querySelectorAll('input[name="chUtilPeriod"]').forEach(radio => {
+  radio.addEventListener('change', e => channelUtilizationHourlyAverage(e.target.value));
+});
+
 channelUtilizationHourlyAverage();
\ No newline at end of file