diff --git a/src/components/colors/colors.js b/src/components/colors/colors.js
index dab35fa129e..54ceb5b96a9 100644
--- a/src/components/colors/colors.js
+++ b/src/components/colors/colors.js
@@ -170,12 +170,10 @@
       var hasTheme = angular.isDefined($mdTheming.THEMES[parts[0]]);
       var theme = hasTheme ? parts.splice(0, 1)[0] : $mdTheming.defaultTheme();
 
-      var defaultHue = parts[0] !== 'accent' ? 500 : 'A200';
-
       return {
         theme: theme,
         palette: extractPalette(parts, theme),
-        hue: parts[1] || defaultHue,
+        hue: extractHue(parts, theme),
         opacity: parts[2] || 1
       };
     }
@@ -203,6 +201,32 @@
 
       return palette;
     }
+
+    function extractHue(parts, theme) {
+      var themeColors = $mdTheming.THEMES[theme].colors;
+
+      if (parts[1] === 'hue') {
+        var hueNumber = Number.parseInt(parts.splice(2, 1)[0]);
+
+        if (hueNumber < 1 || hueNumber > 3) {
+          throw new Error($mdUtil.supplant('mdColors: \'hue-{hueNumber}\' is not a valid hue, can be only \'hue-1\', \'hue-2\' and \'hue-3\'', {hueNumber: hueNumber}));
+        }
+
+        parts[1] = 'hue-' + hueNumber;
+
+
+        if (!(parts[0] in themeColors)) {
+          throw new Error($mdUtil.supplant('mdColors: \'hue-x\' can only be used with [{availableThemes}], but was used with \'{usedTheme}\'', {
+            availableThemes: Object.keys(themeColors).join(', '),
+            usedTheme: parts[0]
+          }));
+        }
+
+        return themeColors[parts[0]].hues[parts[1]];
+      }
+
+      return parts[1] || themeColors[parts[0] in themeColors ? parts[0] : 'primary'].hues['default'];
+    }
   }
 
   /**
@@ -220,7 +244,7 @@
    *   ## `[?theme]-[palette]-[?hue]-[?opacity]`
    *   - [theme]    - default value is the default theme
    *   - [palette]  - can be either palette name or primary/accent/warn/background
-   *   - [hue]      - default is 500
+   *   - [hue]      - default is 500 (hue-x can be used with primary/accent/warn/background)
    *   - [opacity]  - default is 1
    *
    *   > `?` indicates optional parameter
diff --git a/src/components/colors/colors.spec.js b/src/components/colors/colors.spec.js
index 54fbe913b7e..20e2338aac9 100644
--- a/src/components/colors/colors.spec.js
+++ b/src/components/colors/colors.spec.js
@@ -25,7 +25,7 @@ describe('md-colors', function () {
         attrs   : options.attrs,
         palette : options.palette,
         theme   : options.theme || 'default',
-        hue     : '-' + (options.hue || '500'),
+        hue     : '-' + (options.hue || (options.palette === 'accent' ? 'A200' : '500')),
         opacity : '-' + (options.opacity || 1)
       });
 
@@ -36,9 +36,11 @@ describe('md-colors', function () {
     }
 
     function setup(options) {
+      var hue = options.hue = options.hue || '500';
+
       var element = createElement(scope, {
         palette: options.palette,
-        hue: options.hue = options.hue || '500',
+        hue: hue,
         opacity: options.opacity,
         theme: options.theme
       });
@@ -143,7 +145,7 @@ describe('md-colors', function () {
       it('should accept accent palette', function() {
         var type = 'accent';
         var paletteName = $mdTheming.THEMES['default'].colors[type].name;
-        var color = $mdColorPalette[paletteName]['500'].value;
+        var color = $mdColorPalette[paletteName]['A200'].value;
         var expectedRGB = supplant('rgb({0}, {1}, {2})', [color[0], color[1], color[2]]);
         var element = createElement(scope, { palette: type });
 
@@ -176,6 +178,74 @@ describe('md-colors', function () {
         expect(element[0].style.background).toContain( expectedRGB );
       });
 
+      describe('hues', function () {
+        /**
+         * <div md-colors="{background: 'primary-hue-1'}">
+         */
+        it('should accept primary color palette with hue 1', function() {
+          var type = 'primary';
+          var hue = 'hue-1';
+          var palette = $mdTheming.THEMES['default'].colors[type];
+          var paletteName = palette.name;
+          var paletteHue = palette.hues[hue];
+          var color = $mdColorPalette[paletteName][paletteHue].value;
+          var expectedRGB = supplant('rgb({0}, {1}, {2})', [color[0], color[1], color[2]]);
+          var element = createElement(scope, { palette: type, hue: hue });
+
+          expect(element[0].style.background).toContain(expectedRGB);
+        });
+
+        /**
+         * <div md-colors="{background: 'primary-hue-2'}">
+         */
+        it('should accept primary color palette with hue 2', function() {
+          var type = 'primary';
+          var hue = 'hue-2';
+          var palette = $mdTheming.THEMES['default'].colors[type];
+          var paletteName = palette.name;
+          var paletteHue = palette.hues[hue];
+          var color = $mdColorPalette[paletteName][paletteHue].value;
+          var expectedRGB = supplant('rgb({0}, {1}, {2})', [color[0], color[1], color[2]]);
+          var element = createElement(scope, { palette: type, hue: hue });
+
+          expect(element[0].style.background).toContain(expectedRGB);
+        });
+
+        /**
+         * <div md-colors="{background: 'primary-hue-3'}">
+         */
+        it('should accept primary color palette with hue 3', function() {
+          var type = 'primary';
+          var hue = 'hue-3';
+          var palette = $mdTheming.THEMES['default'].colors[type];
+          var paletteName = palette.name;
+          var paletteHue = palette.hues[hue];
+          var color = $mdColorPalette[paletteName][paletteHue].value;
+          var expectedRGB = supplant('rgb({0}, {1}, {2})', [color[0], color[1], color[2]]);
+          var element = createElement(scope, { palette: type, hue: hue });
+
+          expect(element[0].style.background).toContain(expectedRGB);
+        });
+
+        /**
+         * <div md-colors="{background: 'primary-hue-1-0.2'}">
+         */
+        it('should accept primary color palette with hue 1 and 0.2 opacity', function() {
+          var type = 'primary';
+          var hue = 'hue-1';
+          var opacity = 0.2;
+
+          var palette = $mdTheming.THEMES['default'].colors[type];
+          var paletteName = palette.name;
+          var paletteHue = palette.hues[hue];
+          var color = $mdColorPalette[paletteName][paletteHue].value;
+          var expectedRGB = supplant('rgba({0}, {1}, {2}, {3})', [color[0], color[1], color[2], opacity]);
+          var element = createElement(scope, { palette: type, hue: hue, opacity: opacity });
+
+          expect(element[0].style.background).toContain(expectedRGB);
+        });
+      });
+
       describe('custom themes', function () {
 
         /**
@@ -336,5 +406,25 @@ describe('md-colors', function () {
       var themeColor = $mdColors.getThemeColor('red-200');
       expect(themeColor).toBe( expectedRGB );
     }));
+
+    describe('palette hues', function () {
+      it('should throw error on hue-4', inject(function ($mdColors) {
+        expect(function () {
+          $mdColors.getThemeColor('primary-hue-4')
+        }).toThrowError();
+      }));
+
+      it('should throw error on hue-0', inject(function ($mdColors) {
+        expect(function () {
+          $mdColors.getThemeColor('primary-hue-0')
+        }).toThrowError();
+      }));
+
+      it('should throw error on usage of defined palette and hue', inject(function ($mdColors) {
+        expect(function () {
+          $mdColors.getThemeColor('red-hue-1')
+        }).toThrowError();
+      }));
+    });
   })
 });