diff --git a/app/styles/colors.scss b/app/styles/colors.scss
index a85b55e452..fd42e7b873 100644
--- a/app/styles/colors.scss
+++ b/app/styles/colors.scss
@@ -104,4 +104,8 @@
   --spec12: #83FD83;
   --spec13: #B6882D;
   --spec14: #130E05;
+  --spec15: #cd61a7;
+  --spec16: #7fb56d;
+  --spec17: #328509;
+  --spec18: #9c0f9c;
 }
diff --git a/app/styles/object_inspector.scss b/app/styles/object_inspector.scss
index ffb421a497..8ce81cd21a 100644
--- a/app/styles/object_inspector.scss
+++ b/app/styles/object_inspector.scss
@@ -46,7 +46,7 @@
     left: -9px;
     width: 1px;
     height: 8px;
-    background-color: #888;
+    background-color: var(--base16);
   }
 
   svg {
@@ -55,8 +55,8 @@
     left: -13px;
     
     ellipse {
-      stroke: #888;
-      fill: #fff;
+      stroke: var(--base16);
+      fill: var(--base00);
     }
   }
 }
diff --git a/app/styles/pill.scss b/app/styles/pill.scss
index b2b690ebcd..35a7693c8a 100644
--- a/app/styles/pill.scss
+++ b/app/styles/pill.scss
@@ -14,7 +14,7 @@
   background: transparent;
   border-radius: 8px;
   vertical-align: middle;
-  background: var(--base18);
+  background: var(--base11);
 }
 
 a.active > .pill {
diff --git a/app/styles/toolbar.scss b/app/styles/toolbar.scss
index 243cdb16cf..8057e7b641 100644
--- a/app/styles/toolbar.scss
+++ b/app/styles/toolbar.scss
@@ -148,7 +148,7 @@ $toolbar-height: 28px;
   margin-left: 2px;
   margin-right: 2px;
   padding: 0 6px;
-  background: var(--base12);
+  background: var(--base03);
   border: none;
   border-radius: 2px;
   vertical-align: middle;
@@ -171,11 +171,11 @@ $toolbar-height: 28px;
 }
 
 .toolbar__radio:hover {
-  background: var(--base16);
+  background: var(--base06);
 }
 
 .toolbar__radio:active {
-  background: var(--base19);
+  background: var(--base00);
 }
 
 .toolbar__radio.active {
diff --git a/public/assets/svg/dependent-key-bullet.svg b/public/assets/svg/dependent-key-bullet.svg
index 41cb878cc5..09923134a7 100644
--- a/public/assets/svg/dependent-key-bullet.svg
+++ b/public/assets/svg/dependent-key-bullet.svg
@@ -1,3 +1,3 @@
-<svg width="9" height="9" aria-hidden="true">
+<svg width="9" height="9" aria-hidden="true" viewBox="0 0 9 9">
   <ellipse cx="4.5" cy="4.5" rx="3.5" ry="3.5" stroke-width="1"></ellipse>
 </svg>
diff --git a/public/assets/svg/dependent-key-connection.svg b/public/assets/svg/dependent-key-connection.svg
index 4d4653abbe..c4c255aa87 100644
--- a/public/assets/svg/dependent-key-connection.svg
+++ b/public/assets/svg/dependent-key-connection.svg
@@ -1,3 +1,3 @@
-<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="20" height="10">
+<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="20" height="10" viewBox="0 0 20 10">
   <path fill="none" stroke="#888" d="M.5 0v1.6c0 2.1 1.7 3.896 3.7 3.896h10.5c2.1 0 3.815 1.704 3.815 3.804v.7"/>
 </svg>