diff --git a/lib/forms.less b/lib/forms.less
index 87fcc3d1a332..1a875336e50a 100755
--- a/lib/forms.less
+++ b/lib/forms.less
@@ -19,7 +19,7 @@ fieldset {
     padding-left: 150px;
     font-size: @basefont * 1.5;
     line-height: 1;
-    color: @grayDark;
+    color: @darkerGrayColor;
     *padding: 0 0 5px 145px; /* IE6-7 */
     *line-height: 1.5; /* IE6-7 */
   }
@@ -47,7 +47,7 @@ label {
   float: left;
   width: 130px;
   text-align: right;
-  color: @grayDark;
+  color: @darkerGrayColor;
 }
 
 // Shift over the inside div to align all label's relevant content
@@ -72,7 +72,7 @@ select,
   padding: 4px;
   font-size: @basefont;
   line-height: @baseline;
-  color: @gray;
+  color: @darkGrayColor;
   border: 1px solid #ccc;
   .border-radius(3px);
 }
@@ -95,7 +95,7 @@ input[type=radio] {
 }
 
 input[type=file] {
-  background-color: @white;
+  background-color: @whiteColor;
   padding: initial;
   border: initial;
   line-height: initial;
@@ -120,7 +120,7 @@ input[type=file] {
 // Make multiple select elements height not fixed
 select[multiple] {
   height: inherit;
-  background-color: @white; // Fixes Chromium bug of unreadable items
+  background-color: @whiteColor; // Fixes Chromium bug of unreadable items
 }
 
 textarea {
@@ -129,7 +129,7 @@ textarea {
 
 // For text that needs to appear as an input but should not be an input
 .uneditable-input {
-  background-color: @white;
+  background-color: @whiteColor;
   display: block;
   border-color: #eee;
   .box-shadow(inset 0 1px 2px rgba(0,0,0,.025));
@@ -138,10 +138,10 @@ textarea {
 
 // Placeholder text gets special styles; can't be bundled together though for some reason
 :-moz-placeholder {
-  color: @grayLight;
+  color: @lightGrayColor;
 }
 ::-webkit-input-placeholder {
-  color: @grayLight;
+  color: @lightGrayColor;
 }
 
 // Focus states
@@ -197,15 +197,15 @@ select:focus {
 }
 // Error
 form .clearfix.error {
-  .formFieldState(#b94a48, #ee5f5b, lighten(#ee5f5b, 30%));
+  .formFieldState(lighten(@redColor, 5%), lighten(@redColor, 25%), lighten(@redColor, 50%));
 }
 // Warning
 form .clearfix.warning {
-  .formFieldState(#c09853, #ccae64, lighten(#CCAE64, 5%));
+  .formFieldState(darken(@yellowColor, 15%), darken(@yellowColor, 10%), lighten(@yellowColor, 25%));
 }
 // Success
 form .clearfix.success {
-  .formFieldState(#468847, #57a957, lighten(#57a957, 30%));
+  .formFieldState(darken(@greenColor, 5%), lighten(@greenColor, 5%), lighten(@greenColor, 35%));
 }
 
 
@@ -287,18 +287,18 @@ textarea[disabled],
 input[readonly],
 select[readonly],
 textarea[readonly] {
-  background-color: #f5f5f5;
-  border-color: #ddd;
+  background-color: lighten(@lighterGrayColor, 6%);
+  border-color: darken(@lighterGrayColor, 3%);
   cursor: not-allowed;
 }
 
 // Actions (the buttons)
 .actions {
-  background: #f5f5f5;
+  background: lighten(@lighterGrayColor, 6%);
   margin-top: @baseline;
   margin-bottom: @baseline;
   padding: (@baseline - 1) 20px @baseline 150px;
-  border-top: 1px solid #ddd;
+  border-top: 1px solid darken(@lighterGrayColor, 3%);
   .border-radius(0 0 3px 3px);
   .secondary-action {
     float: right;
@@ -317,7 +317,7 @@ textarea[readonly] {
 .help-block {
   font-size: @basefont;
   line-height: @baseline;
-  color: @grayLight;
+  color: @lightGrayColor;
 }
 .help-inline {
   padding-left: 5px;
@@ -333,7 +333,7 @@ textarea[readonly] {
 
 // Inline Fields (input fields that appear as inline objects
 .inline-inputs {
-  color: @gray;
+  color: @darkGrayColor;
   span {
     padding: 0 2px 0 1px;
   }
@@ -359,14 +359,14 @@ textarea[readonly] {
     margin-right: -1px;
     font-weight: normal;
     line-height: 18px;
-    color: @grayLight;
+    color: @lightGrayColor;
     text-align: center;
-    text-shadow: 0 1px 0 @white;
+    text-shadow: 0 1px 0 @whiteColor;
     .border-radius(3px 0 0 3px);
   }
   .active {
-    background: lighten(@green, 30);
-    border-color: @green;
+    background: lighten(@greenColor, 30);
+    border-color: @greenColor;
   }
 }
 .input-prepend {
@@ -405,7 +405,7 @@ textarea[readonly] {
     text-align: left;
     white-space: normal;
     strong {
-      color: @gray;
+      color: @darkGrayColor;
     }
     small {
       font-size: @basefont - 2;
diff --git a/lib/mixins.less b/lib/mixins.less
index 4a05133c650f..b753fa0cc68f 100644
--- a/lib/mixins.less
+++ b/lib/mixins.less
@@ -34,7 +34,7 @@
 }
 
 // Input placeholder text
-.placeholder(@color: @grayLight) {
+.placeholder(@color: @lightGrayColor) {
   :-moz-placeholder {
     color: @color;
   }
@@ -143,10 +143,10 @@
 
 // Add an alphatransparency value to any background or border color (via Elyse Holladay)
 #translucent {
-  .background(@color: @white, @alpha: 1) {
+  .background(@color: @whiteColor, @alpha: 1) {
     background-color: hsla(hue(@color), saturation(@color), lightness(@color), @alpha);
   }
-  .border(@color: @white, @alpha: 1) {
+  .border(@color: @whiteColor, @alpha: 1) {
     border-color: hsla(hue(@color), saturation(@color), lightness(@color), @alpha);
     background-clip: padding-box;
   }
diff --git a/lib/patterns.less b/lib/patterns.less
index b70ae1cb2400..33bbda3504c4 100644
--- a/lib/patterns.less
+++ b/lib/patterns.less
@@ -18,7 +18,7 @@
 
   // Links get text shadow
   a {
-    color: @grayLight;
+    color: @lightGrayColor;
     text-shadow: 0 -1px 0 rgba(0,0,0,.25);
   }
 
@@ -29,7 +29,7 @@
   ul .active > a {
     background-color: #333;
     background-color: rgba(255,255,255,.05);
-    color: @white;
+    color: @whiteColor;
     text-decoration: none;
   }
 
@@ -44,7 +44,7 @@
     display: block;
     padding: 8px 20px 12px;
     margin-left: -20px; // negative indent to left-align the text down the page
-    color: @white;
+    color: @whiteColor;
     font-size: 20px;
     font-weight: 200;
     line-height: 1;
@@ -56,7 +56,7 @@
     line-height: 40px;
     a:hover {
       background-color: transparent;
-      color: @white;
+      color: @whiteColor;
     }
   }
 
@@ -76,7 +76,7 @@
     background-color: rgba(255,255,255,.3);
     #font > .sans-serif(13px, normal, 1);
     padding: 4px 9px;
-    color: @white;
+    color: @whiteColor;
     color: rgba(255,255,255,.75);
     border: 1px solid #111;
     .border-radius(4px);
@@ -86,24 +86,24 @@
 
     // Placeholder text gets special styles; can't be bundled together though for some reason
     &:-moz-placeholder {
-      color: @grayLighter;
+      color: @lighterGrayColor;
     }
     &::-webkit-input-placeholder {
-      color: @grayLighter;
+      color: @lighterGrayColor;
     }
     // Hover states
     &:hover {
-      background-color: @grayLight;
+      background-color: @lightGrayColor;
       background-color: rgba(255,255,255,.5);
-      color: @white;
+      color: @whiteColor;
     }
     // Focus states (we use .focused since IE8 and down doesn't support :focus)
     &:focus,
     &.focused {
       outline: 0;
-      background-color: @white;
-      color: @grayDark;
-      text-shadow: 0 1px 0 @white;
+      background-color: @whiteColor;
+      color: @darkerGrayColor;
+      text-shadow: 0 1px 0 @whiteColor;
       border: 0;
       padding: 5px 10px;
       .box-shadow(0 0 3px rgba(0,0,0,.15));
@@ -115,8 +115,8 @@
 // For backwards compatibility, include .topbar .fill
 .topbar-inner,
 .topbar .fill {
-  background-color: #222;
-  #gradient > .vertical(#333, #222);
+  background-color: @topbarDarkColor;
+  #gradient > .vertical(@topbarLightColor, @topbarDarkColor);
   @shadow: 0 1px 3px rgba(0,0,0,.25), inset 0 -1px 0 rgba(0,0,0,.1);
   .box-shadow(@shadow);
 }
@@ -146,12 +146,12 @@
     line-height: 19px;
     text-decoration: none;
     &:hover {
-      color: @white;
+      color: @whiteColor;
       text-decoration: none;
     }
   }
   .active > a {
-    background-color: #222;
+    background-color: darken(@topbarDarkColor, 5%);
     background-color: rgba(0,0,0,.5);
   }
 
@@ -173,36 +173,36 @@
   li.open .menu,
   .dropdown-toggle:hover,
   .dropdown.open .dropdown-toggle {
-    background: #444;
+    background: lighten(@topbarDarkColor, 5%);
     background: rgba(255,255,255,.05);
   }
   // .menu-dropdown for backwards compatibility
   .menu-dropdown,
   .dropdown-menu {
-    background-color: #333;
+    background-color: darken(@topbarLightColor, 5%);
     // a.menu for backwards compatibility
     a.menu,
     .dropdown-toggle {
-      color: @white;
+      color: @whiteColor;
       &.open {
-        background: #444;
+        background: @topbarLightColor;
         background: rgba(255,255,255,.05);
       }
     }
     li a {
-      color: #999;
+      color: @lightGrayColor;
       text-shadow: 0 1px 0 rgba(0,0,0,.5);
       &:hover {
-        #gradient > .vertical(#292929,#191919);
-        color: @white;
+        #gradient > .vertical(@topbarDarkColor, darken(@topbarDarkColor, 8%));
+        color: @whiteColor;
       }
     }
     .active a {
-      color: @white;
+      color: @whiteColor;
     }
     .divider {
-      background-color: #222;
-      border-color: #444;
+      background-color: @topbarDarkColor;
+      border-color: @topbarLightColor;
     }
   }
 }
@@ -234,14 +234,14 @@ a.menu:after,
   margin-left: 4px;
   border-left: 4px solid transparent;
   border-right: 4px solid transparent;
-  border-top: 4px solid @white;
+  border-top: 4px solid @whiteColor;
   .opacity(50);
 }
 // The dropdown menu (ul)
 // .menu-dropdown for backwards compatibility
 .menu-dropdown,
 .dropdown-menu {
-  background-color: @white;
+  background-color: @whiteColor;
   float: left;
   display: none; // None by default, but block on "open" of the menu
   position: absolute;
@@ -274,7 +274,7 @@ a.menu:after,
     margin: 5px 0;
     overflow: hidden;
     background-color: #eee;
-    border-bottom: 1px solid @white;
+    border-bottom: 1px solid @whiteColor;
   }
 }
 
@@ -287,13 +287,13 @@ a.menu:after,
     clear: both;
     font-weight: normal;
     line-height: 18px;
-    color: @gray;
-    text-shadow: 0 1px 0 @white;
+    color: @darkGrayColor;
+    text-shadow: 0 1px 0 @whiteColor;
     // Hover state
     &:hover,
     &.hover {
       #gradient > .vertical(#eeeeee, #dddddd);
-      color: @grayDark;
+      color: @darkerGrayColor;
       text-decoration: none;
       @shadow: inset 0 1px 0 rgba(0,0,0,.025), inset 0 -1px rgba(0,0,0,.025);
       .box-shadow(@shadow);
@@ -308,7 +308,7 @@ a.menu:after,
   // .menu for backwards compatibility
   .menu,
   .dropdown-toggle {
-    color: @white;
+    color: @whiteColor;
     background: #ccc;
     background: rgba(0,0,0,.3);
   }
@@ -362,8 +362,8 @@ a.menu:after,
   // Active state, and it's :hover to override normal :hover
   .active > a,
   .active > a:hover {
-    color: @gray;
-    background-color: @white;
+    color: @darkGrayColor;
+    background-color: @whiteColor;
     border: 1px solid #ddd;
     border-bottom-color: transparent;
     cursor: default;
@@ -404,19 +404,19 @@ a.menu:after,
     margin: 5px 3px 5px 0;
     padding: 0 15px;
     line-height: 30px;
-    text-shadow: 0 1px 1px @white;
+    text-shadow: 0 1px 1px @whiteColor;
     .border-radius(15px);
     &:hover {
-      color: @white;
+      color: @whiteColor;
       text-decoration: none;
       text-shadow: 0 1px 1px rgba(0,0,0,.25);
-      background-color: @linkColorHover;
+      background-color: @darkMainColor;
     }
   }
   .active a {
-    color: @white;
+    color: @whiteColor;
     text-shadow: 0 1px 1px rgba(0,0,0,.25);
-    background-color: @linkColor;
+    background-color: @mainColor;
   }
 }
 
@@ -450,17 +450,17 @@ a.menu:after,
   #gradient > .vertical(#ffffff, #f5f5f5);
   border: 1px solid #ddd;
   .border-radius(3px);
-  .box-shadow(inset 0 1px 0 @white);
+  .box-shadow(inset 0 1px 0 @whiteColor);
   li {
     display: inline;
-    text-shadow: 0 1px 0 @white;
+    text-shadow: 0 1px 0 @whiteColor;
   }
   .divider {
     padding: 0 5px;
-    color: @grayLight;
+    color: @lightGrayColor;
   }
   .active a {
-    color: @grayDark;
+    color: @darkerGrayColor;
   }
 }
 
@@ -520,7 +520,7 @@ footer {
   &.success:hover,
   &.info,
   &.info:hover {
-    color: @white
+    color: @whiteColor
   }
   // Sets the close button to the middle of message
   .close{
@@ -530,15 +530,15 @@ footer {
   // Danger and error appear as red
   &.danger,
   &.error {
-    .gradientBar(#ee5f5b, #c43c35);
+    .gradientBar(lighten(@redColor, 26%), lighten(@redColor, 9%));
   }
   // Success appears as green
   &.success {
-    .gradientBar(#62c462, #57a957);
+    .gradientBar(lighten(@greenColor, 17%), @greenColor);
   }
   // Info appears as a neutral blue
   &.info {
-    .gradientBar(#5bc0de, #339bb9);
+    .gradientBar(lighten(desaturate(@cyanColor, 40%), 22%), lighten(desaturate(@cyanColor, 30%), 2%));
   }
 }
 
@@ -547,7 +547,7 @@ footer {
   // Button Base
   cursor: pointer;
   display: inline-block;
-  #gradient > .vertical-three-colors(#ffffff, #ffffff, 25%, darken(#ffffff, 10%)); // Don't use .gradientbar() here since it does a three-color gradient
+  #gradient > .vertical-three-colors(@whiteColor, @whiteColor, 25%, @lighterGrayColor); // Don't use .gradientbar() here since it does a three-color gradient
   padding: 5px 14px 6px;
   text-shadow: 0 1px 1px rgba(255,255,255,.75);
   color: #333;
@@ -572,8 +572,8 @@ footer {
 
   // Primary Button Type
   &.primary {
-    color: @white;
-    .gradientBar(@blue, @blueDark)
+    color: @whiteColor;
+    .gradientBar(@cyanColor, @blueColor)
   }
 
    // Transitions
@@ -634,14 +634,14 @@ input[type=submit].btn {
 // -----------
 .close {
   float: right;
-  color: @black;
+  color: @blackColor;
   font-size: 20px;
   font-weight: bold;
   line-height: @baseline * .75;
   text-shadow: 0 1px 0 rgba(255,255,255,1);
   .opacity(25);
   &:hover {
-    color: @black;
+    color: @blackColor;
     text-decoration: none;
     .opacity(40);
   }
@@ -656,8 +656,8 @@ input[type=submit].btn {
   position: relative;
   padding: 7px 15px;
   margin-bottom: @baseline;
-  color: @grayDark;
-  .gradientBar(#fceec1, #eedc94); // warning by default
+  color: @darkerGrayColor; //#eedc94
+  .gradientBar(lighten(desaturate(@yellowColor, 20%), 35%), lighten(desaturate(@yellowColor, 20%), 25%)); // warning by default
   text-shadow: 0 1px 0 rgba(255,255,255,.5);
   border-width: 1px;
   border-style: solid;
@@ -673,13 +673,13 @@ input[type=submit].btn {
   // Make links same color as text and stand out more
   a {
     font-weight: bold;
-    color: @grayDark;
+    color: @darkerGrayColor;
   }
   &.danger p a,
   &.error p a,
   &.success p a,
   &.info p a {
-    color: @white;
+    color: @whiteColor;
   }
 
   // Remove extra margin from content
@@ -701,10 +701,10 @@ input[type=submit].btn {
 
   &.block-message {
     background-image: none;
-    background-color: lighten(#fceec1, 5%);
+    background-color: lighten(desaturate(@yellowColor, 15%), 39%);
     .reset-filter();
     padding: 14px;
-    border-color: #fceec1;
+    border-color: lighten(desaturate(@yellowColor, 10%), 34%);
     .box-shadow(none);
     ul, p {
       margin-right: 30px;
@@ -713,7 +713,7 @@ input[type=submit].btn {
       margin-bottom: 0;
     }
     li {
-      color: @grayDark;
+      color: @darkerGrayColor;
     }
     .alert-actions {
       margin-top: 5px;
@@ -721,27 +721,27 @@ input[type=submit].btn {
     &.error,
     &.success,
     &.info {
-      color: @grayDark;
+      color: @darkerGrayColor;
       text-shadow: 0 1px 0 rgba(255,255,255,.5);
     }
     &.error {
-      background-color: lighten(#f56a66, 25%);
-      border-color: lighten(#f56a66, 20%);
+      background-color: lighten(@redColor, 55%);
+      border-color: lighten(@redColor, 50%);
     }
     &.success {
-      background-color: lighten(#62c462, 30%);
-      border-color: lighten(#62c462, 25%);
+      background-color: lighten(@greenColor, 41%);
+      border-color: lighten(@greenColor, 36%);
     }
     &.info {
-      background-color: lighten(#6bd0ee, 25%);
-      border-color: lighten(#6bd0ee, 20%);
+      background-color: lighten(desaturate(@cyanColor, 10%), 49%);
+      border-color: lighten(desaturate(@cyanColor, 10%), 44%);
     }
     // Change link color back
     &.danger p a,
     &.error p a,
     &.success p a,
     &.info p a {
-      color: @grayDark;
+      color: @darkerGrayColor;
     }
 
   }
@@ -777,12 +777,12 @@ input[type=submit].btn {
   }
   a:hover,
   .active a {
-    background-color: lighten(@blue, 45%);
+    background-color: lighten(@cyanColor, 45%);
   }
   .disabled a,
   .disabled a:hover {
     background-color: transparent;
-    color: @grayLight;
+    color: @lightGrayColor;
   }
   .next a {
     border: 0;
@@ -813,7 +813,7 @@ input[type=submit].btn {
 // ------
 
 .modal-backdrop {
-  background-color: @black;
+  background-color: @blackColor;
   position: fixed;
   top: 0;
   left: 0;
@@ -838,7 +838,7 @@ input[type=submit].btn {
   overflow: auto;
   width: 560px;
   margin: -250px 0 0 -280px;
-  background-color: @white;
+  background-color: @whiteColor;
   border: 1px solid #999;
   border: 1px solid rgba(0,0,0,.3);
   *border: 1px solid #999; /* IE6-7 */
@@ -867,7 +867,7 @@ input[type=submit].btn {
   padding: 14px 15px 15px;
   border-top: 1px solid #ddd;
   .border-radius(0 0 6px 6px);
-  .box-shadow(inset 0 1px 0 @white);
+  .box-shadow(inset 0 1px 0 @whiteColor);
   .clearfix();
   margin-bottom: 0;
   .btn {
@@ -893,7 +893,7 @@ input[type=submit].btn {
     margin-left: -@arrowWidth;
     border-left: @arrowWidth solid transparent;
     border-right: @arrowWidth solid transparent;
-    border-top: @arrowWidth solid @black;
+    border-top: @arrowWidth solid @blackColor;
   }
   .left(@arrowWidth: 5px) {
     top: 50%;
@@ -901,7 +901,7 @@ input[type=submit].btn {
     margin-top: -@arrowWidth;
     border-top: @arrowWidth solid transparent;
     border-bottom: @arrowWidth solid transparent;
-    border-left: @arrowWidth solid @black;
+    border-left: @arrowWidth solid @blackColor;
   }
   .below(@arrowWidth: 5px) {
     top: 0;
@@ -909,7 +909,7 @@ input[type=submit].btn {
     margin-left: -@arrowWidth;
     border-left: @arrowWidth solid transparent;
     border-right: @arrowWidth solid transparent;
-    border-bottom: @arrowWidth solid @black;
+    border-bottom: @arrowWidth solid @blackColor;
   }
   .right(@arrowWidth: 5px) {
     top: 50%;
@@ -917,7 +917,7 @@ input[type=submit].btn {
     margin-top: -@arrowWidth;
     border-top: @arrowWidth solid transparent;
     border-bottom: @arrowWidth solid transparent;
-    border-right: @arrowWidth solid @black;
+    border-right: @arrowWidth solid @blackColor;
   }
 }
 
@@ -942,7 +942,7 @@ input[type=submit].btn {
 }
 .twipsy-inner {
   padding: 3px 8px;
-  background-color: @black;
+  background-color: @blackColor;
   color: white;
   text-align: center;
   max-width: 200px;
@@ -976,8 +976,8 @@ input[type=submit].btn {
     height: 0;
   }
   .inner {
-    background: @black;
-    background: rgba(0,0,0,.8);
+    background: @blackColor;
+    background: hsla(hue(@blackColor), saturation(@blackColor), lightness(@blackColor), 0.8);
     padding: 3px;
     overflow: hidden;
     width: 280px;
@@ -992,7 +992,7 @@ input[type=submit].btn {
     border-bottom:1px solid #eee;
   }
   .content {
-    background-color: @white;
+    background-color: @whiteColor;
     padding: 14px;
     .border-radius(0 0 3px 3px);
     .background-clip(padding-box);
@@ -1022,16 +1022,16 @@ input[type=submit].btn {
   padding: 1px 3px 2px;
   font-size: @basefont * .75;
   font-weight: bold;
-  color: @white;
+  color: @whiteColor;
   text-transform: uppercase;
   white-space: nowrap;
-  background-color: @grayLight;
+  background-color: @lightGrayColor;
   .border-radius(3px);
   text-shadow: none;
-  &.important { background-color: #c43c35; }
-  &.warning   { background-color: @orange; }
-  &.success   { background-color: @green; }
-  &.notice    { background-color: lighten(@blue, 25%); }
+  &.important { background-color: lighten(@redColor, 10%); }
+  &.warning   { background-color: @orangeColor; }
+  &.success   { background-color: @greenColor; }
+  &.notice    { background-color: lighten(@cyanColor, 25%); }
 }
 
 
@@ -1056,7 +1056,7 @@ input[type=submit].btn {
       display: block;
     }
     &:hover {
-      border-color: @linkColor;
+      border-color: @mainColor;
       .box-shadow(0 1px 4px rgba(0,105,214,.25));
     }
   }
diff --git a/lib/scaffolding.less b/lib/scaffolding.less
index e99046253b12..d13682955b5f 100644
--- a/lib/scaffolding.less
+++ b/lib/scaffolding.less
@@ -8,10 +8,10 @@
 // -----------------
 
 body {
-  background-color: @white;
+  background-color: @whiteColor;
   margin: 0;
   #font > .sans-serif(normal,@basefont,@baseline);
-  color: @grayDark;
+  color: @darkerGrayColor;
 }
 
 // Container (centered, fixed-width layouts)
@@ -44,12 +44,12 @@ body {
 
 // Links
 a {
-  color: @linkColor;
+  color: @mainColor;
   text-decoration: none;
   line-height: inherit;
   font-weight: inherit;
   &:hover {
-    color: @linkColorHover;
+    color: @darkMainColor;
     text-decoration: underline;
   }
 }
diff --git a/lib/tables.less b/lib/tables.less
index 6145c9483c4e..678f12cf9a08 100644
--- a/lib/tables.less
+++ b/lib/tables.less
@@ -169,56 +169,65 @@ table {
   }
   // Blue Table Headings
   .blue {
-    color: @blue;
-    border-bottom-color: @blue;
+    color: @cyanColor;
+    border-bottom-color: @cyanColor;
   }
   .headerSortUp.blue,
   .headerSortDown.blue {
-    background-color: lighten(@blue, 40%);
+    background-color: lighten(@cyanColor, 40%);
   }
   // Green Table Headings
   .green {
-    color: @green;
-    border-bottom-color: @green;
+    color: @greenColor;
+    border-bottom-color: @greenColor;
   }
   .headerSortUp.green,
   .headerSortDown.green {
-    background-color: lighten(@green, 40%);
+    background-color: lighten(@greenColor, 40%);
   }
   // Red Table Headings
   .red {
-    color: @red;
-    border-bottom-color: @red;
+    color: @redColor;
+    border-bottom-color: @redColor;
   }
   .headerSortUp.red,
   .headerSortDown.red {
-    background-color: lighten(@red, 50%);
+    background-color: lighten(@redColor, 50%);
   }
   // Yellow Table Headings
   .yellow {
-    color: @yellow;
-    border-bottom-color: @yellow;
+    color: @yellowColor;
+    border-bottom-color: @yellowColor;
   }
   .headerSortUp.yellow,
   .headerSortDown.yellow {
-    background-color: lighten(@yellow, 40%);
+    background-color: lighten(@yellowColor, 40%);
   }
   // Orange Table Headings
   .orange {
-    color: @orange;
-    border-bottom-color: @orange;
+    color: @orangeColor;
+    border-bottom-color: @orangeColor;
   }
   .headerSortUp.orange,
   .headerSortDown.orange {
-    background-color: lighten(@orange, 40%);
+    background-color: lighten(@orangeColor, 40%);
+  }
+  // Pink Table Headings
+  .pink {
+    color: @pinkColor;
+    border-bottom-color: @pinkColor;
+  }
+  .headerSortUp.pink,
+  .headerSortDown.pink {
+    background-color: lighten(@pinkColor, 40%);
   }
   // Purple Table Headings
   .purple {
-    color: @purple;
-    border-bottom-color: @purple;
+    color: @purpleColor;
+    border-bottom-color: @purpleColor;
   }
   .headerSortUp.purple,
   .headerSortDown.purple {
-    background-color: lighten(@purple, 40%);
+    background-color: lighten(@purpleColor, 40%);
   }
 }
\ No newline at end of file
diff --git a/lib/theme.less b/lib/theme.less
new file mode 100644
index 000000000000..e7c2ab4010d3
--- /dev/null
+++ b/lib/theme.less
@@ -0,0 +1,83 @@
+// Hyperlinks, tab text, active pill background, pill text, breadcrumb text,
+// and pagination text.
+// Default Value: #0069d6 (Blue)
+@mainColor:           #26902c; // *CHANGED*
+
+// Hyperlink hover, tab hover text, pill hover background, breadcrumb hover
+// text, pagination hover text
+// Default Value: darken(@mainColor, 15)
+@darkMainColor:       darken(@mainColor, 10); // *CHANGED*
+
+// Tooltips, popover borders, and arrows.
+// Default Value: #000 (Black)
+@blackColor:            #000; 
+
+// Dark text and block message button text.
+// Default Value: lighten(@darkBorderColor, 25%);
+@darkerGrayColor:       lighten(@blackColor, 25%);
+
+// Lists, input text, and current breadcrumb text.
+// Default Value: lighten(@darkBorderColor, 50%);
+@darkGrayColor:         lighten(@blackColor, 50%);
+
+// Topbar links, H6 headings, sub-headings (h1..6 > small), disabled input
+// text, default inline label background and help text.
+// Default Value: lighten(@darkBorderColor, 75%);
+@lightGrayColor:        lighten(@blackColor, 85%); // *CHANGED*
+
+// Topbar input text, form actions background, and disabled input background.
+// Default Value: lighten(@darkBorderColor, 90%);
+@lighterGrayColor:      lighten(@blackColor, 90%);
+
+// Background, topbar title, topbar active link, inline label text, multiple
+// select background, disabled input background, file input background,
+// colored button text (primary, info, success, and danger), active tab
+// background, active pill text, inactive pill text shadow, breadcrumb text
+// shadow, basic alerts text (error, success, and info only), modal
+// background, and popover background.
+// Default Value: #fff (White)
+@whiteColor:            #fff;
+
+// Topbar light color.
+// Default Value: #333 (Dark Grey)
+@topbarLightColor:      @mainColor; // *CHANGED*
+
+// Topbar dark color.
+// Default Value: #222 (Darker Grey)
+@topbarDarkColor:       darken(@darkMainColor, 5%); // *CHANGED*
+
+// Blue table headings, primary button light background, and notice inline
+// label background.
+// Default Value: #049cdb (Cyan)
+@cyanColor:             @mainColor; // *CHANGED*
+
+// Primary button dark background.
+// Default Value: #0064cd (Blue)
+@blueColor:             @darkMainColor; // *CHANGED*
+
+// Green table headings, success inline label background, appended checkbox
+// background, and inputs with success.
+// Default Value: #46a546 (Green)
+@greenColor:            #46a546;
+
+// Red table headings, important inline label background, and inputs with
+// errors.
+// Default Value: #9d261d (Red)
+@redColor:              #9d261d;
+
+// Yellow table headings and inputs with warnings.
+// Default Value: #ffc40d (Yellow)
+@yellowColor:           #ffc40d;
+
+// Orange table headings, warning inline label background, and code
+// highlighting (<code/>).
+// Default Value: #f89406 (Orange)
+@orangeColor:           #f89406;
+
+// Unused.
+// Default Value: #c3325f (Pink)
+@pinkColor:             #c3325f;
+
+// Purple table headings.
+// Default Value: #7a43b6 (Purple)
+@purpleColor:           #7a43b6;
diff --git a/lib/type.less b/lib/type.less
index 077ae9d8f71d..239d951a1545 100644
--- a/lib/type.less
+++ b/lib/type.less
@@ -11,7 +11,7 @@ p {
   margin-bottom: @baseline / 2;
   small {
     font-size: @basefont - 2;
-    color: @grayLight;
+    color: @lightGrayColor;
   }
 }
 
@@ -21,9 +21,9 @@ p {
 
 h1, h2, h3, h4, h5, h6 {
   font-weight: bold;
-  color: @grayDark;
+  color: @darkerGrayColor;
   small {
-    color: @grayLight;
+    color: @lightGrayColor;
   }
 }
 h1 {
@@ -61,7 +61,7 @@ h5 {
 }
 h6 {
   font-size: 13px;
-  color: @grayLight;
+  color: @lightGrayColor;
   text-transform: uppercase;
 }
 
@@ -85,9 +85,9 @@ ul {
 ol {
   list-style: decimal;
 }
-li {
+li, dt, dd {
   line-height: @baseline;
-  color: @gray;
+  color: @darkGrayColor;
 }
 ul.unstyled {
   list-style: none;
@@ -97,9 +97,6 @@ ul.unstyled {
 // Description Lists
 dl {
   margin-bottom: @baseline;
-  dt, dd {
-    line-height: @baseline;
-  }
   dt {
     font-weight: bold;
   }
@@ -129,7 +126,7 @@ em {
   line-height: inherit;
 }
 .muted {
-  color: @grayLight;
+  color: @lightGrayColor;
 }
 
 // Blockquotes
@@ -144,7 +141,7 @@ blockquote {
   small {
     display: block;
     #font > .shorthand(300,12px,@baseline);
-    color: @grayLight;
+    color: @lightGrayColor;
     &:before {
       content: '\2014 \00A0';
     }
@@ -166,7 +163,7 @@ code, pre {
   .border-radius(3px);
 }
 code {
-  background-color: lighten(@orange, 40%);
+  background-color: lighten(@orangeColor, 40%);
   color: rgba(0,0,0,.75);
   padding: 1px 3px;
 }
diff --git a/lib/variables.less b/lib/variables.less
index 34000d066993..4d85e99c2c65 100644
--- a/lib/variables.less
+++ b/lib/variables.less
@@ -2,28 +2,7 @@
  * Variables to customize the look and feel of Bootstrap
  * ----------------------------------------------------- */
 
-
-// Links
-@linkColor:         #0069d6;
-@linkColorHover:    darken(@linkColor, 15);
-
-// Grays
-@black:             #000;
-@grayDark:          lighten(@black, 25%);
-@gray:              lighten(@black, 50%);
-@grayLight:         lighten(@black, 75%);
-@grayLighter:       lighten(@black, 90%);
-@white:             #fff;
-
-// Accent Colors
-@blue:              #049CDB;
-@blueDark:          #0064CD;
-@green:             #46a546;
-@red:               #9d261d;
-@yellow:            #ffc40d;
-@orange:            #f89406;
-@pink:              #c3325f;
-@purple:            #7a43b6;
+@import "theme.less";
 
 // Baseline grid
 @basefont:          13px;
@@ -39,16 +18,16 @@
 
 // Color Scheme
 // Use this to roll your own color schemes if you like (unused by Bootstrap by default)
-@baseColor:         @blue;                  // Set a base color
-@complement:        spin(@baseColor, 180);  // Determine a complementary color
-@split1:            spin(@baseColor, 158);  // Split complements
-@split2:            spin(@baseColor, -158);
-@triad1:            spin(@baseColor, 135);  // Triads colors
-@triad2:            spin(@baseColor, -135);
-@tetra1:            spin(@baseColor, 90);   // Tetra colors
-@tetra2:            spin(@baseColor, -90);
-@analog1:           spin(@baseColor, 22);   // Analogs colors
-@analog2:           spin(@baseColor, -22);
+@baseColor:         @cyanColor;                  // Set a base color
+@complement:        spin(@cyanColor, 180);  // Determine a complementary color
+@split1:            spin(@cyanColor, 158);  // Split complements
+@split2:            spin(@cyanColor, -158);
+@triad1:            spin(@cyanColor, 135);  // Triads colors
+@triad2:            spin(@cyanColor, -135);
+@tetra1:            spin(@cyanColor, 90);   // Tetra colors
+@tetra2:            spin(@cyanColor, -90);
+@analog1:           spin(@cyanColor, 22);   // Analogs colors
+@analog2:           spin(@cyanColor, -22);