diff --git a/design/switch-down.afdesign b/design/switch-down.afdesign
index cc1e70e..b370ae5 100644
Binary files a/design/switch-down.afdesign and b/design/switch-down.afdesign differ
diff --git a/design/switch-down.svg b/design/switch-down.svg
index 96ccffe..c48ee3a 100644
--- a/design/switch-down.svg
+++ b/design/switch-down.svg
@@ -5,21 +5,24 @@
         <circle cx="373" cy="548" r="9" style="fill:rgb(41,41,41);"/>
     </g>
     <g transform="matrix(0.988744,0,0,0.988744,-358.802,-526.832)">
-        <path d="M373,538.289C367.641,538.289 363.289,542.641 363.289,548C363.289,553.359 367.641,557.711 373,557.711C378.359,557.711 382.711,553.359 382.711,548C382.711,542.641 378.359,538.289 373,538.289ZM373,539.711C377.575,539.711 381.289,543.425 381.289,548C381.289,552.575 377.575,556.289 373,556.289C368.425,556.289 364.711,552.575 364.711,548C364.711,543.425 368.425,539.711 373,539.711Z" style="fill:rgb(132,132,132);"/>
+        <path d="M373,538.289C367.641,538.289 363.289,542.641 363.289,548C363.289,553.359 367.641,557.711 373,557.711C378.359,557.711 382.711,553.359 382.711,548C382.711,542.641 378.359,538.289 373,538.289ZM373,539.711C377.575,539.711 381.289,543.425 381.289,548C381.289,552.575 377.575,556.289 373,556.289C368.425,556.289 364.711,552.575 364.711,548C364.711,543.425 368.425,539.711 373,539.711Z" style="fill:rgb(170,170,170);"/>
     </g>
-    <g transform="matrix(0.325165,0,0,0.325165,-111.873,-162.191)">
-        <circle cx="373" cy="548" r="9" style="fill:rgb(164,164,164);"/>
+    <g transform="matrix(0.988744,0,0,0.988744,-358.802,-526.832)">
+        <path d="M373,538.079C367.524,538.079 363.079,542.524 363.079,548C363.079,553.476 367.524,557.921 373,557.921C378.476,557.921 382.921,553.476 382.921,548C382.921,542.524 378.476,538.079 373,538.079ZM373,538.5C378.243,538.5 382.5,542.757 382.5,548C382.5,553.243 378.243,557.5 373,557.5C367.757,557.5 363.5,553.243 363.5,548C363.5,542.757 367.757,538.5 373,538.5ZM373,539.5C368.309,539.5 364.5,543.309 364.5,548C364.5,552.691 368.309,556.5 373,556.5C377.691,556.5 381.5,552.691 381.5,548C381.5,543.309 377.691,539.5 373,539.5ZM373,539.921C377.459,539.921 381.079,543.541 381.079,548C381.079,552.459 377.459,556.079 373,556.079C368.541,556.079 364.921,552.459 364.921,548C364.921,543.541 368.541,539.921 373,539.921Z" style="fill:rgb(81,81,81);"/>
     </g>
-    <g transform="matrix(-0.968511,0.830669,-0.415125,-0.48401,21.6275,7.55916)">
-        <path d="M18.63,3.057L14.934,-9.454L9.832,-0.566L11.858,6.975L18.63,3.057Z" style="fill:rgb(164,164,164);"/>
+    <g transform="matrix(0.27848,0,0,0.27848,-93.8731,-137.607)">
+        <circle cx="373" cy="548" r="9" style="fill:rgb(208,208,208);"/>
     </g>
-    <g transform="matrix(0.520392,0,0,0.520392,-187.619,-261.491)">
-        <circle cx="373" cy="548" r="9" style="fill:rgb(90,90,90);"/>
+    <g transform="matrix(-0.708254,0.607453,-0.311769,-0.363504,18.3339,5.97349)">
+        <path d="M14.762,1.213L11.911,-7.678L22.437,-16.222L23.583,-12.409L14.762,1.213Z" style="fill:rgb(208,208,208);"/>
     </g>
-    <g transform="matrix(0.351922,0,0,0.351922,-125.784,-169.17)">
-        <circle cx="373" cy="548" r="9" style="fill:rgb(110,110,110);"/>
+    <g transform="matrix(0.573144,0,0,0.573144,-206.783,-289.274)">
+        <circle cx="373" cy="548" r="9" style="fill:rgb(108,110,138);"/>
     </g>
-    <g transform="matrix(0.156118,0,0,0.100562,-54.1495,-31.9118)">
-        <circle cx="373" cy="548" r="9" style="fill:rgb(204,204,204);"/>
+    <g transform="matrix(0.387597,0,0,0.387597,-138.644,-187.716)">
+        <circle cx="373" cy="548" r="9" style="fill:rgb(147,152,172);"/>
+    </g>
+    <g transform="matrix(0.171944,0,0,0.110756,-59.4563,-36.7216)">
+        <circle cx="373" cy="548" r="9" style="fill:rgb(225,230,242);"/>
     </g>
 </svg>
diff --git a/design/switch-mid.afdesign b/design/switch-mid.afdesign
index f692518..f561bb4 100644
Binary files a/design/switch-mid.afdesign and b/design/switch-mid.afdesign differ
diff --git a/design/switch-mid.svg b/design/switch-mid.svg
index 1e13cdb..4950c98 100644
--- a/design/switch-mid.svg
+++ b/design/switch-mid.svg
@@ -5,21 +5,21 @@
         <circle cx="373" cy="548" r="9" style="fill:rgb(41,41,41);"/>
     </g>
     <g transform="matrix(0.988744,0,0,0.988744,-358.802,-526.832)">
-        <path d="M373,538.289C367.641,538.289 363.289,542.641 363.289,548C363.289,553.359 367.641,557.711 373,557.711C378.359,557.711 382.711,553.359 382.711,548C382.711,542.641 378.359,538.289 373,538.289ZM373,539.711C377.575,539.711 381.289,543.425 381.289,548C381.289,552.575 377.575,556.289 373,556.289C368.425,556.289 364.711,552.575 364.711,548C364.711,543.425 368.425,539.711 373,539.711Z" style="fill:rgb(132,132,132);"/>
+        <path d="M373,538.289C367.641,538.289 363.289,542.641 363.289,548C363.289,553.359 367.641,557.711 373,557.711C378.359,557.711 382.711,553.359 382.711,548C382.711,542.641 378.359,538.289 373,538.289ZM373,539.711C377.575,539.711 381.289,543.425 381.289,548C381.289,552.575 377.575,556.289 373,556.289C368.425,556.289 364.711,552.575 364.711,548C364.711,543.425 368.425,539.711 373,539.711Z" style="fill:rgb(170,170,170);"/>
     </g>
-    <g transform="matrix(0.380447,0,0,0.380447,-133.815,-192.259)">
-        <circle cx="373" cy="548" r="9" style="fill:rgb(164,164,164);"/>
+    <g transform="matrix(0.988744,0,0,0.988744,-358.802,-526.832)">
+        <path d="M373,538.079C367.524,538.079 363.079,542.524 363.079,548C363.079,553.476 367.524,557.921 373,557.921C378.476,557.921 382.921,553.476 382.921,548C382.921,542.524 378.476,538.079 373,538.079ZM373,538.5C378.243,538.5 382.5,542.757 382.5,548C382.5,553.243 378.243,557.5 373,557.5C367.757,557.5 363.5,553.243 363.5,548C363.5,542.757 367.757,538.5 373,538.5ZM373,539.5C368.309,539.5 364.5,543.309 364.5,548C364.5,552.691 368.309,556.5 373,556.5C377.691,556.5 381.5,552.691 381.5,548C381.5,543.309 377.691,539.5 373,539.5ZM373,539.921C377.459,539.921 381.079,543.541 381.079,548C381.079,552.459 377.459,556.079 373,556.079C368.541,556.079 364.921,552.459 364.921,548C364.921,543.541 368.541,539.921 373,539.921Z" style="fill:rgb(81,81,81);"/>
     </g>
-    <g transform="matrix(0.805188,0.989796,-0.494648,0.40239,4.35621,2.01601)">
-        <path d="M13.062,8.009L7.943,7.807L7.095,11.574L13.787,12.281L13.062,8.009Z" style="fill:rgb(164,164,164);"/>
+    <g transform="matrix(0.27848,0,0,0.27848,-93.8731,-137.607)">
+        <circle cx="373" cy="548" r="9" style="fill:rgb(208,208,208);"/>
     </g>
-    <g transform="matrix(0.520392,0,0,0.520392,-188.79,-266.896)">
-        <circle cx="373" cy="548" r="9" style="fill:rgb(90,90,90);"/>
+    <g transform="matrix(0.573144,0,0,0.573144,-207.941,-298.925)">
+        <circle cx="373" cy="548" r="9" style="fill:rgb(108,110,138);"/>
     </g>
-    <g transform="matrix(0.351922,0,0,0.351922,-126.923,-174.686)">
-        <circle cx="373" cy="548" r="9" style="fill:rgb(110,110,110);"/>
+    <g transform="matrix(0.387597,0,0,0.387597,-139.803,-197.367)">
+        <circle cx="373" cy="548" r="9" style="fill:rgb(147,152,172);"/>
     </g>
-    <g transform="matrix(0.156118,0,0,0.100562,-55.0229,-37.589)">
-        <circle cx="373" cy="548" r="9" style="fill:rgb(204,204,204);"/>
+    <g transform="matrix(0.171944,0,0,0.110756,-60.6146,-46.3729)">
+        <circle cx="373" cy="548" r="9" style="fill:rgb(225,230,242);"/>
     </g>
 </svg>
diff --git a/design/switch-up.afdesign b/design/switch-up.afdesign
index 6a56013..f8eb785 100644
Binary files a/design/switch-up.afdesign and b/design/switch-up.afdesign differ
diff --git a/design/switch-up.svg b/design/switch-up.svg
index e0e519f..cee2ef2 100644
--- a/design/switch-up.svg
+++ b/design/switch-up.svg
@@ -5,21 +5,24 @@
         <circle cx="373" cy="548" r="9" style="fill:rgb(41,41,41);"/>
     </g>
     <g transform="matrix(0.988744,0,0,0.988744,-358.802,-526.832)">
-        <path d="M373,538.289C367.641,538.289 363.289,542.641 363.289,548C363.289,553.359 367.641,557.711 373,557.711C378.359,557.711 382.711,553.359 382.711,548C382.711,542.641 378.359,538.289 373,538.289ZM373,539.711C377.575,539.711 381.289,543.425 381.289,548C381.289,552.575 377.575,556.289 373,556.289C368.425,556.289 364.711,552.575 364.711,548C364.711,543.425 368.425,539.711 373,539.711Z" style="fill:rgb(132,132,132);"/>
+        <path d="M373,538.289C367.641,538.289 363.289,542.641 363.289,548C363.289,553.359 367.641,557.711 373,557.711C378.359,557.711 382.711,553.359 382.711,548C382.711,542.641 378.359,538.289 373,538.289ZM373,539.711C377.575,539.711 381.289,543.425 381.289,548C381.289,552.575 377.575,556.289 373,556.289C368.425,556.289 364.711,552.575 364.711,548C364.711,543.425 368.425,539.711 373,539.711Z" style="fill:rgb(170,170,170);"/>
     </g>
-    <g transform="matrix(0.325165,0,0,0.325165,-111.873,-164.24)">
-        <circle cx="373" cy="548" r="9" style="fill:rgb(164,164,164);"/>
+    <g transform="matrix(0.988744,0,0,0.988744,-358.802,-526.832)">
+        <path d="M373,538.079C367.524,538.079 363.079,542.524 363.079,548C363.079,553.476 367.524,557.921 373,557.921C378.476,557.921 382.921,553.476 382.921,548C382.921,542.524 378.476,538.079 373,538.079ZM373,538.5C378.243,538.5 382.5,542.757 382.5,548C382.5,553.243 378.243,557.5 373,557.5C367.757,557.5 363.5,553.243 363.5,548C363.5,542.757 367.757,538.5 373,538.5ZM373,539.5C368.309,539.5 364.5,543.309 364.5,548C364.5,552.691 368.309,556.5 373,556.5C377.691,556.5 381.5,552.691 381.5,548C381.5,543.309 377.691,539.5 373,539.5ZM373,539.921C377.459,539.921 381.079,543.541 381.079,548C381.079,552.459 377.459,556.079 373,556.079C368.541,556.079 364.921,552.459 364.921,548C364.921,543.541 368.541,539.921 373,539.921Z" style="fill:rgb(81,81,81);"/>
     </g>
-    <g transform="matrix(-0.968511,0.830669,-0.415125,-0.48401,21.6275,7.55916)">
-        <path d="M12.767,5.853L8.574,2.453L4.281,15.498L11.041,21.088L12.767,5.853Z" style="fill:rgb(164,164,164);"/>
+    <g transform="matrix(0.27848,0,0,0.27848,-93.8731,-137.607)">
+        <circle cx="373" cy="548" r="9" style="fill:rgb(208,208,208);"/>
     </g>
-    <g transform="matrix(0.520392,0,0,0.520392,-187.619,-280.491)">
-        <circle cx="373" cy="548" r="9" style="fill:rgb(90,90,90);"/>
+    <g transform="matrix(-0.708254,0.607453,-0.311769,-0.363504,18.3339,5.97349)">
+        <path d="M15.46,-0.372L10.513,-4.513L7.785,17.064L9.354,18.31L15.46,-0.372Z" style="fill:rgb(208,208,208);"/>
     </g>
-    <g transform="matrix(0.351922,0,0,0.351922,-125.28,-189.17)">
-        <circle cx="373" cy="548" r="9" style="fill:rgb(110,110,110);"/>
+    <g transform="matrix(0.573144,0,0,0.573144,-206.783,-308.893)">
+        <circle cx="373" cy="548" r="9" style="fill:rgb(108,110,138);"/>
     </g>
-    <g transform="matrix(0.156118,0,0,0.100562,-53.1495,-52.3295)">
-        <circle cx="373" cy="548" r="9" style="fill:rgb(204,204,204);"/>
+    <g transform="matrix(0.387597,0,0,0.387597,-138.644,-207.335)">
+        <circle cx="373" cy="548" r="9" style="fill:rgb(147,152,172);"/>
+    </g>
+    <g transform="matrix(0.171944,0,0,0.110756,-59.4563,-56.3408)">
+        <circle cx="373" cy="548" r="9" style="fill:rgb(225,230,242);"/>
     </g>
 </svg>
diff --git a/index.html b/index.html
index d19763d..51cb0fe 100644
--- a/index.html
+++ b/index.html
@@ -451,7 +451,7 @@
           <path d="M1420,108.734C1426.21,108.734 1431.24,113.778 1431.24,120L1431.24,730C1431.24,736.222 1426.21,741.266 1420,741.266L30,741.266C23.791,741.266 18.757,736.222 18.757,730L18.757,120C18.757,113.778 23.791,108.734 30,108.734L1420,108.734ZM41.243,131.266L41.243,718.734L1408.76,718.734L1408.76,131.266L41.243,131.266Z" style="fill:rgb(105,168,216);"/>
         </g>
 
-        <svg id="led-on" x="100" y="100" width="20" height="20" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;display:none;">
+        <svg id="led-on" x="0" y="0" width="20" height="20" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
           <g transform="matrix(1.09178,0,0,1.09178,-234.48,-360.035)">
             <circle cx="223.927" cy="338.927" r="8.927" style="fill:rgb(101,29,28);"/>
           </g>
@@ -466,7 +466,7 @@
           </g>
         </svg>
 
-        <svg id="led-off" x="130" y="100" width="20" height="20" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;display:none;">
+        <svg id="led-off" x="0" y="0" width="20" height="20" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
           <g transform="matrix(1.04197,0,0,1.04197,-222.88,-342.706)">
             <g transform="matrix(1.04781,0,0,1.04781,-11.1324,-16.6304)">
               <circle cx="223.927" cy="338.927" r="8.927" style="fill:rgb(69,23,22);"/>
@@ -483,75 +483,81 @@
           </g>
         </svg>
 
-        <svg id="switch-mid" x="100" y="150" width="20" height="30" viewBox="0 0 20 30" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;display:none;">
+        <svg id="switch-up" x="0" y="0" width="20" height="30" viewBox="0 0 20 30" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
           <g transform="matrix(0.988744,0,0,0.988744,-358.802,-526.832)">
             <circle cx="373" cy="548" r="9" style="fill:rgb(41,41,41);"/>
           </g>
           <g transform="matrix(0.988744,0,0,0.988744,-358.802,-526.832)">
-            <path d="M373,538.289C367.641,538.289 363.289,542.641 363.289,548C363.289,553.359 367.641,557.711 373,557.711C378.359,557.711 382.711,553.359 382.711,548C382.711,542.641 378.359,538.289 373,538.289ZM373,539.711C377.575,539.711 381.289,543.425 381.289,548C381.289,552.575 377.575,556.289 373,556.289C368.425,556.289 364.711,552.575 364.711,548C364.711,543.425 368.425,539.711 373,539.711Z" style="fill:rgb(132,132,132);"/>
+            <path d="M373,538.289C367.641,538.289 363.289,542.641 363.289,548C363.289,553.359 367.641,557.711 373,557.711C378.359,557.711 382.711,553.359 382.711,548C382.711,542.641 378.359,538.289 373,538.289ZM373,539.711C377.575,539.711 381.289,543.425 381.289,548C381.289,552.575 377.575,556.289 373,556.289C368.425,556.289 364.711,552.575 364.711,548C364.711,543.425 368.425,539.711 373,539.711Z" style="fill:rgb(170,170,170);"/>
           </g>
-          <g transform="matrix(0.380447,0,0,0.380447,-133.815,-192.259)">
-            <circle cx="373" cy="548" r="9" style="fill:rgb(164,164,164);"/>
+          <g transform="matrix(0.988744,0,0,0.988744,-358.802,-526.832)">
+            <path d="M373,538.079C367.524,538.079 363.079,542.524 363.079,548C363.079,553.476 367.524,557.921 373,557.921C378.476,557.921 382.921,553.476 382.921,548C382.921,542.524 378.476,538.079 373,538.079ZM373,538.5C378.243,538.5 382.5,542.757 382.5,548C382.5,553.243 378.243,557.5 373,557.5C367.757,557.5 363.5,553.243 363.5,548C363.5,542.757 367.757,538.5 373,538.5ZM373,539.5C368.309,539.5 364.5,543.309 364.5,548C364.5,552.691 368.309,556.5 373,556.5C377.691,556.5 381.5,552.691 381.5,548C381.5,543.309 377.691,539.5 373,539.5ZM373,539.921C377.459,539.921 381.079,543.541 381.079,548C381.079,552.459 377.459,556.079 373,556.079C368.541,556.079 364.921,552.459 364.921,548C364.921,543.541 368.541,539.921 373,539.921Z" style="fill:rgb(81,81,81);"/>
           </g>
-          <g transform="matrix(0.805188,0.989796,-0.494648,0.40239,4.35621,2.01601)">
-            <path d="M13.062,8.009L7.943,7.807L7.095,11.574L13.787,12.281L13.062,8.009Z" style="fill:rgb(164,164,164);"/>
+          <g transform="matrix(0.27848,0,0,0.27848,-93.8731,-137.607)">
+            <circle cx="373" cy="548" r="9" style="fill:rgb(208,208,208);"/>
           </g>
-          <g transform="matrix(0.520392,0,0,0.520392,-188.79,-266.896)">
-            <circle cx="373" cy="548" r="9" style="fill:rgb(90,90,90);"/>
+          <g transform="matrix(-0.708254,0.607453,-0.311769,-0.363504,18.3339,5.97349)">
+            <path d="M15.46,-0.372L10.513,-4.513L7.785,17.064L9.354,18.31L15.46,-0.372Z" style="fill:rgb(208,208,208);"/>
           </g>
-          <g transform="matrix(0.351922,0,0,0.351922,-126.923,-174.686)">
-            <circle cx="373" cy="548" r="9" style="fill:rgb(110,110,110);"/>
+          <g transform="matrix(0.573144,0,0,0.573144,-206.783,-308.893)">
+            <circle cx="373" cy="548" r="9" style="fill:rgb(108,110,138);"/>
           </g>
-          <g transform="matrix(0.156118,0,0,0.100562,-55.0229,-37.589)">
-            <circle cx="373" cy="548" r="9" style="fill:rgb(204,204,204);"/>
+          <g transform="matrix(0.387597,0,0,0.387597,-138.644,-207.335)">
+            <circle cx="373" cy="548" r="9" style="fill:rgb(147,152,172);"/>
+          </g>
+          <g transform="matrix(0.171944,0,0,0.110756,-59.4563,-56.3408)">
+            <circle cx="373" cy="548" r="9" style="fill:rgb(225,230,242);"/>
           </g>
         </svg>
 
-        <svg id="switch-up" x="130" y="150" width="20" height="30" viewBox="0 0 20 30" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;display:none;">
+        <svg id="switch-mid" x="0" y="0" width="20" height="30" viewBox="0 0 20 30" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
           <g transform="matrix(0.988744,0,0,0.988744,-358.802,-526.832)">
             <circle cx="373" cy="548" r="9" style="fill:rgb(41,41,41);"/>
           </g>
           <g transform="matrix(0.988744,0,0,0.988744,-358.802,-526.832)">
-            <path d="M373,538.289C367.641,538.289 363.289,542.641 363.289,548C363.289,553.359 367.641,557.711 373,557.711C378.359,557.711 382.711,553.359 382.711,548C382.711,542.641 378.359,538.289 373,538.289ZM373,539.711C377.575,539.711 381.289,543.425 381.289,548C381.289,552.575 377.575,556.289 373,556.289C368.425,556.289 364.711,552.575 364.711,548C364.711,543.425 368.425,539.711 373,539.711Z" style="fill:rgb(132,132,132);"/>
+            <path d="M373,538.289C367.641,538.289 363.289,542.641 363.289,548C363.289,553.359 367.641,557.711 373,557.711C378.359,557.711 382.711,553.359 382.711,548C382.711,542.641 378.359,538.289 373,538.289ZM373,539.711C377.575,539.711 381.289,543.425 381.289,548C381.289,552.575 377.575,556.289 373,556.289C368.425,556.289 364.711,552.575 364.711,548C364.711,543.425 368.425,539.711 373,539.711Z" style="fill:rgb(170,170,170);"/>
           </g>
-          <g transform="matrix(0.325165,0,0,0.325165,-111.873,-164.24)">
-            <circle cx="373" cy="548" r="9" style="fill:rgb(164,164,164);"/>
+          <g transform="matrix(0.988744,0,0,0.988744,-358.802,-526.832)">
+            <path d="M373,538.079C367.524,538.079 363.079,542.524 363.079,548C363.079,553.476 367.524,557.921 373,557.921C378.476,557.921 382.921,553.476 382.921,548C382.921,542.524 378.476,538.079 373,538.079ZM373,538.5C378.243,538.5 382.5,542.757 382.5,548C382.5,553.243 378.243,557.5 373,557.5C367.757,557.5 363.5,553.243 363.5,548C363.5,542.757 367.757,538.5 373,538.5ZM373,539.5C368.309,539.5 364.5,543.309 364.5,548C364.5,552.691 368.309,556.5 373,556.5C377.691,556.5 381.5,552.691 381.5,548C381.5,543.309 377.691,539.5 373,539.5ZM373,539.921C377.459,539.921 381.079,543.541 381.079,548C381.079,552.459 377.459,556.079 373,556.079C368.541,556.079 364.921,552.459 364.921,548C364.921,543.541 368.541,539.921 373,539.921Z" style="fill:rgb(81,81,81);"/>
           </g>
-          <g transform="matrix(-0.968511,0.830669,-0.415125,-0.48401,21.6275,7.55916)">
-            <path d="M12.767,5.853L8.574,2.453L4.281,15.498L11.041,21.088L12.767,5.853Z" style="fill:rgb(164,164,164);"/>
+          <g transform="matrix(0.27848,0,0,0.27848,-93.8731,-137.607)">
+            <circle cx="373" cy="548" r="9" style="fill:rgb(208,208,208);"/>
           </g>
-          <g transform="matrix(0.520392,0,0,0.520392,-187.619,-280.491)">
-            <circle cx="373" cy="548" r="9" style="fill:rgb(90,90,90);"/>
+          <g transform="matrix(0.573144,0,0,0.573144,-207.941,-298.925)">
+            <circle cx="373" cy="548" r="9" style="fill:rgb(108,110,138);"/>
           </g>
-          <g transform="matrix(0.351922,0,0,0.351922,-125.28,-189.17)">
-            <circle cx="373" cy="548" r="9" style="fill:rgb(110,110,110);"/>
+          <g transform="matrix(0.387597,0,0,0.387597,-139.803,-197.367)">
+            <circle cx="373" cy="548" r="9" style="fill:rgb(147,152,172);"/>
           </g>
-          <g transform="matrix(0.156118,0,0,0.100562,-53.1495,-52.3295)">
-            <circle cx="373" cy="548" r="9" style="fill:rgb(204,204,204);"/>
+          <g transform="matrix(0.171944,0,0,0.110756,-60.6146,-46.3729)">
+            <circle cx="373" cy="548" r="9" style="fill:rgb(225,230,242);"/>
           </g>
         </svg>
 
-        <svg id="switch-down" x="160" y="150" width="20" height="30" viewBox="0 0 20 30" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;display:none;">
+        <svg id="switch-down" x="0" y="0" width="20" height="30" viewBox="0 0 20 30" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
           <g transform="matrix(0.988744,0,0,0.988744,-358.802,-526.832)">
             <circle cx="373" cy="548" r="9" style="fill:rgb(41,41,41);"/>
           </g>
           <g transform="matrix(0.988744,0,0,0.988744,-358.802,-526.832)">
-            <path d="M373,538.289C367.641,538.289 363.289,542.641 363.289,548C363.289,553.359 367.641,557.711 373,557.711C378.359,557.711 382.711,553.359 382.711,548C382.711,542.641 378.359,538.289 373,538.289ZM373,539.711C377.575,539.711 381.289,543.425 381.289,548C381.289,552.575 377.575,556.289 373,556.289C368.425,556.289 364.711,552.575 364.711,548C364.711,543.425 368.425,539.711 373,539.711Z" style="fill:rgb(132,132,132);"/>
+            <path d="M373,538.289C367.641,538.289 363.289,542.641 363.289,548C363.289,553.359 367.641,557.711 373,557.711C378.359,557.711 382.711,553.359 382.711,548C382.711,542.641 378.359,538.289 373,538.289ZM373,539.711C377.575,539.711 381.289,543.425 381.289,548C381.289,552.575 377.575,556.289 373,556.289C368.425,556.289 364.711,552.575 364.711,548C364.711,543.425 368.425,539.711 373,539.711Z" style="fill:rgb(170,170,170);"/>
           </g>
-          <g transform="matrix(0.325165,0,0,0.325165,-111.873,-162.191)">
-            <circle cx="373" cy="548" r="9" style="fill:rgb(164,164,164);"/>
+          <g transform="matrix(0.988744,0,0,0.988744,-358.802,-526.832)">
+            <path d="M373,538.079C367.524,538.079 363.079,542.524 363.079,548C363.079,553.476 367.524,557.921 373,557.921C378.476,557.921 382.921,553.476 382.921,548C382.921,542.524 378.476,538.079 373,538.079ZM373,538.5C378.243,538.5 382.5,542.757 382.5,548C382.5,553.243 378.243,557.5 373,557.5C367.757,557.5 363.5,553.243 363.5,548C363.5,542.757 367.757,538.5 373,538.5ZM373,539.5C368.309,539.5 364.5,543.309 364.5,548C364.5,552.691 368.309,556.5 373,556.5C377.691,556.5 381.5,552.691 381.5,548C381.5,543.309 377.691,539.5 373,539.5ZM373,539.921C377.459,539.921 381.079,543.541 381.079,548C381.079,552.459 377.459,556.079 373,556.079C368.541,556.079 364.921,552.459 364.921,548C364.921,543.541 368.541,539.921 373,539.921Z" style="fill:rgb(81,81,81);"/>
           </g>
-          <g transform="matrix(-0.968511,0.830669,-0.415125,-0.48401,21.6275,7.55916)">
-            <path d="M18.63,3.057L14.934,-9.454L9.832,-0.566L11.858,6.975L18.63,3.057Z" style="fill:rgb(164,164,164);"/>
+          <g transform="matrix(0.27848,0,0,0.27848,-93.8731,-137.607)">
+            <circle cx="373" cy="548" r="9" style="fill:rgb(208,208,208);"/>
           </g>
-          <g transform="matrix(0.520392,0,0,0.520392,-187.619,-261.491)">
-            <circle cx="373" cy="548" r="9" style="fill:rgb(90,90,90);"/>
+          <g transform="matrix(-0.708254,0.607453,-0.311769,-0.363504,18.3339,5.97349)">
+            <path d="M14.762,1.213L11.911,-7.678L22.437,-16.222L23.583,-12.409L14.762,1.213Z" style="fill:rgb(208,208,208);"/>
           </g>
-          <g transform="matrix(0.351922,0,0,0.351922,-125.784,-169.17)">
-            <circle cx="373" cy="548" r="9" style="fill:rgb(110,110,110);"/>
+          <g transform="matrix(0.573144,0,0,0.573144,-206.783,-289.274)">
+            <circle cx="373" cy="548" r="9" style="fill:rgb(108,110,138);"/>
           </g>
-          <g transform="matrix(0.156118,0,0,0.100562,-54.1495,-31.9118)">
-            <circle cx="373" cy="548" r="9" style="fill:rgb(204,204,204);"/>
+          <g transform="matrix(0.387597,0,0,0.387597,-138.644,-187.716)">
+            <circle cx="373" cy="548" r="9" style="fill:rgb(147,152,172);"/>
+          </g>
+          <g transform="matrix(0.171944,0,0,0.110756,-59.4563,-36.7216)">
+            <circle cx="373" cy="548" r="9" style="fill:rgb(225,230,242);"/>
           </g>
         </svg>
 
diff --git a/js/panel.js b/js/panel.js
index 085d77b..8161ba5 100644
--- a/js/panel.js
+++ b/js/panel.js
@@ -607,6 +607,9 @@ panel.createLed = function(id, x, y) {
     var ledOnElem = document.getElementById('led-on');
     var ledOffElem = document.getElementById('led-off');
 
+    ledOnElem.style.display = 'none';
+    ledOffElem.style.display = 'none';
+
     var onElem = ledOnElem.cloneNode(true);
     onElem.id = id + '-on';
     onElem.x.baseVal.value = '' + x;
@@ -659,6 +662,10 @@ panel.createSwitch = function(id, type, x, y, upperCmd, lowerCmd) {
     var switchUpElem = document.getElementById('switch-up');
     var switchDownElem = document.getElementById('switch-down');
 
+    switchMidElem.style.display = 'none';
+    switchUpElem.style.display = 'none';
+    switchDownElem.style.display = 'none';
+
     var midElem = switchMidElem.cloneNode(true);
     midElem.id = id + '-mid';
     midElem.x.baseVal.value = '' + x;