diff --git a/src/renderer/views/pages/settings.ejs b/src/renderer/views/pages/settings.ejs
index 69f2a63e..af5c8cd6 100644
--- a/src/renderer/views/pages/settings.ejs
+++ b/src/renderer/views/pages/settings.ejs
@@ -557,12 +557,7 @@
                         {{$root.getLz('settings.option.experimental.compactUI')}}
                     </div>
                     <div class="md-option-segment md-option-segment_auto">
-                        <button class="md-btn"
-                                :class="{'md-btn-primary': app.cfg.advanced.experiments.includes('compactui')}"
-                                @click="app.cfg.advanced.experiments.includes('compactui') ? removeExperiment('compactui') : addExperiment('compactui')">
-                            {{app.cfg.advanced.experiments.includes('compactui') ? $root.getLz('term.disabled') :
-                            $root.getLz('term.enabled')}}
-                        </button>
+                        <input type="checkbox" v-model="app.cfg.advanced.experiments.includes('compactui')" @click="app.cfg.advanced.experiments.includes('compactui') ? removeExperiment('compactui') : addExperiment('compactui')" switch/>
                     </div>
                 </div>
 
@@ -748,7 +743,7 @@
 			},
 			sendDataToMTT: function () {
 				ipcRenderer.invoke('setStoreValue', 'general.close_behavior', app.cfg.general.close_behavior);
-			}
+			},
 		}
 	})
 </script>