Update to the new syntax-colors

index.less

@@ -1,16 +1,31 @@
+@import 'syntax-variables';
+
 .editor-colors {
-  background-color: #1d1f21;
-  color: #c5c8c6;
+  background-color: @syntax-background-color;
+  color: @syntax-text-color;
 }
 
 .editor {
-  .invisible-character,
+  .invisible-character {
+    color: @syntax-invisible-character-color;
+  }
+
   .indent-guide {
-    color: rgba(197, 200, 198, .2);
+    color: @syntax-indent-guide-color;
   }
 
   .wrap-guide {
-    background-color: rgba(197, 200, 198, .1);
+    background-color: @syntax-wrap-guide-color;
+  }
+
+  .gutter {
+    background-color: @syntax-gutter-background-color;
+  }
+  .gutter .cursor-line {
+    background-color: @syntax-gutter-background-color-selected;
+  }
+  .line-number.cursor-line-no-selection {
+    background-color: @syntax-gutter-background-color-selected;
   }
 
   .gutter .line-number.folded,
@@ -20,19 +35,15 @@
   }
 
   .invisible {
-    color: #c5c8c6;
+    color: @syntax-text-color;
   }
 
   .cursor {
-    border-color: #FFFFFF;
+    border-color: @syntax-cursor-color;
   }
 
   .selection .region {
-    background-color: #444444;
-  }
-
-  .line-number.cursor-line-no-selection {
-    background-color: rgba(255, 255, 255, 0.14);
+    background-color: @syntax-selection-color;
   }
 
   // Markdown Styles
@@ -92,11 +103,11 @@
 
   .search-results .marker .region {
     background-color: transparent;
-    border: 1px solid #ddd;
+    border: 1px solid @syntax-result-marker-color;
   }
 
   .search-results .marker.current-result .region {
-    border: 1px solid #0d0;
+    border: 1px solid @syntax-result-marker-color-selected;
   }
 }
 

stylesheets/syntax-variables.less

@@ -1,3 +1,29 @@
+// This file has fallback variables. It specifies all syntax variables that
+// themes must implement if they include a syntax-variables.less file.
+
+// General colors
+@syntax-text-color: #c5c8c6;
+@syntax-cursor-color: white;
+@syntax-selection-color: #444444;
+@syntax-background-color: #1d1f21;
+
+// Guide colors
+@syntax-wrap-guide-color: rgba(197, 200, 198, .1);
+@syntax-indent-guide-color: rgba(197, 200, 198, .2);
+@syntax-invisible-character-color: rgba(197, 200, 198, .2);
+
+// For find and replace markers
+@syntax-result-marker-color: #888;
+@syntax-result-marker-color-selected: white;
+
+// Gutter colors
+@syntax-gutter-text-color: @syntax-text-color;
+@syntax-gutter-text-color-selected: @syntax-gutter-text-color;
+@syntax-gutter-background-color: lighten(@syntax-background-color, 5%);
+@syntax-gutter-background-color-selected: rgba(255, 255, 255, 0.14);
+
+// For git diff info. i.e. in the gutter
+@syntax-color-renamed: #96CBFE;
 @syntax-color-added: #A8FF60;
 @syntax-color-modified: #E9C062;
 @syntax-color-removed: #CC6666;