diff --git a/public/css/style.scss b/public/css/style.scss
index d1874ab4d..e2bc43082 100644
--- a/public/css/style.scss
+++ b/public/css/style.scss
@@ -2403,7 +2403,7 @@ key {
   }
 }
 
-.hidden-key {
+.hidden-key, .hide-key {
   opacity: 0;
 }
 
@@ -2436,4 +2436,9 @@ key {
 .matrix {
   display: flex;
   justify-content: left;
+  margin-left: 4.51rem;
 }
+
+.matrixSpace {
+  grid-template-columns: 6.75fr 1.90fr 6.75fr;
+}
\ No newline at end of file
diff --git a/public/index.html b/public/index.html
index 92d63c7fb..2c299c81c 100644
--- a/public/index.html
+++ b/public/index.html
@@ -1244,12 +1244,12 @@
               <div class="button" keymapMode="next" tabindex="0" onclick="this.blur();">next</div>
             </div>
           </div>
-          <div class="section keymapMatrix">
-              <h1>keymap matrix</h1>
-              <div class="text">Displays the layout in a matrix style.</div>
+          <div class="section keymapStyle">
+              <h1>keymap style</h1>
+              <div class="text">Displays the keymap in a different style.</div>
               <div class="buttons">
-                <div class="button off" tabindex="0" onclick="this.blur();">off</div>
-                <div class="button on" tabindex="0" onclick="this.blur();">on</div>
+                <div class="button" keymapStyle="off" tabindex="0" onclick="this.blur();">off</div>
+                <div class="button" keymapStyle="matrix" tabindex="0" onclick="this.blur();">matrix</div>
               </div>
           </div>
           <div class="section keymapLayout">
diff --git a/public/js/settings.js b/public/js/settings.js
index eafad97bf..6406a92ed 100644
--- a/public/js/settings.js
+++ b/public/js/settings.js
@@ -93,17 +93,17 @@ settingsGroups.keymapMode = new SettingsGroup(
   },
   () => {
     if (config.keymapMode === "off") {
+      $(".pageSettings .section.keymapStyle").addClass("hidden");
       $(".pageSettings .section.keymapLayout").addClass("hidden");
-      $(".pageSettings .section.keymapMatrix").addClass("hidden");
     } else {
+      $(".pageSettings .section.keymapStyle").removeClass("hidden");
       $(".pageSettings .section.keymapLayout").removeClass("hidden");
-      $(".pageSettings .section.keymapMatrix").removeClass("hidden");
     }
   }
 );
 settingsGroups.keymapMatrix = new SettingsGroup(
-  "keymapMatrix",
-  changeKeymapMatrix
+  "keymapStyle",
+  changeKeymapStyle
 );
 settingsGroups.keymapLayout = new SettingsGroup(
   "keymapLayout",
diff --git a/public/js/userconfig.js b/public/js/userconfig.js
index acf6c41df..5303ca9d2 100644
--- a/public/js/userconfig.js
+++ b/public/js/userconfig.js
@@ -40,7 +40,7 @@ let defaultConfig = {
   stopOnError: false,
   showAllLines: false,
   keymapMode: "off",
-  keymapMatrix: false,
+  keymapStyle: "off",
   keymapLayout: "qwerty",
   fontFamily: "Roboto_Mono",
   smoothLineScroll: false,
@@ -148,7 +148,7 @@ function applyConfig(configObj) {
     setTimerColor(configObj.timerColor, true);
     setTimerOpacity(configObj.timerOpacity, true);
     changeKeymapMode(configObj.keymapMode, true);
-    changeKeymapMatrix(configObj.keymapMatrix, true);
+    changeKeymapStyle(configObj.keymapStyle, true);
     changeKeymapLayout(configObj.keymapLayout, true);
     setFontFamily(configObj.fontFamily, true);
     setSmoothLineScroll(configObj.smoothLineScroll, true);
@@ -793,14 +793,22 @@ function changeKeymapMode(mode, nosave) {
   if (!nosave) saveConfigToCookie();
 }
 
-function changeKeymapMatrix(boolean, nosave) {
-  if (boolean !== undefined) config.keymapMatrix = boolean;
-  if (boolean === false) {
+function changeKeymapStyle(style, nosave) {
+  if (style === "off") {
     $(".r1, .r2, .r3, .r4").removeClass("matrix");
+    $(".r5").removeClass("matrixSpace");
+    $("#KeyLeftBracket").removeClass("hide-key");
+    $("#KeyRightBracket").removeClass("hide-key");
+    $("#KeyQuote").removeClass("hide-key");
   }
-  if (boolean === true) {
+  if (style === "matrix") {
     $(".r1, .r2, .r3, .r4").addClass("matrix");
+    $(".r5").addClass("matrixSpace");
+    $("#KeyLeftBracket").addClass("hide-key");
+    $("#KeyRightBracket").addClass("hide-key");
+    $("#KeyQuote").addClass("hide-key");
   }
+  config.keymapStyle = style;
   if (!nosave) saveConfigToCookie();
 }