diff --git a/css/app.css b/css/app.css
index 042228b1..5757e715 100644
--- a/css/app.css
+++ b/css/app.css
@@ -134,3 +134,21 @@ ul {
     background-image: url(../images/grips/vertical.png); }
   .grip:hover:before {
     display: block; }
+
+.key-editor__popup {
+  border: none;
+  width: 0px;
+  height: 0px;
+  position: absolute;
+  top: 215px;
+  left: 50%;
+  margin-left: -310px; }
+
+svg.uhk.faded #left-case,
+svg.uhk.faded #right-case {
+  fill: #555; }
+
+svg.uhk.faded rect {
+  fill: #666; }
+  svg.uhk.faded rect.active {
+    fill: #000; }
diff --git a/sass/app.scss b/sass/app.scss
index 8610fdef..48121274 100644
--- a/sass/app.scss
+++ b/sass/app.scss
@@ -219,3 +219,32 @@ ul {
     }
   }
 }
+
+.key-editor__popup {
+  border: none;
+  width: 0px;
+  height: 0px;
+
+  // Static setting for quick portotyping.
+  position: absolute;
+  top: 215px;
+  left: 50%;
+  margin-left: -310px;
+}
+
+svg.uhk {
+  &.faded {
+    #left-case,
+    #right-case {
+      fill: #555;
+    }
+
+    rect {
+      fill: #666;
+
+      &.active {
+        fill: #000;
+      }
+    }
+  }
+}