Using Hues in html elements from defined color palette

Feature request

1. There should be way to use the hues defined in palette theme.
2. Provision to add color into html element from material design swatches (similar to md-color of previous version of angular material).

What is the expected behavior?

$app-primary: mat-palette($mat-grey, 500, 50, 900); In html element, I should be able to use hues defined in my palette (above) something like color="primary mat-hue-2".

What is the current behavior?

I am able just to use color=“primary”, there is no way of using hues from defined palette/material design swatches.

What is the use-case or motivation for changing an existing behavior?

If we can get something similar of what angular material have: <p md-colors="{background: 'purple-600'}> all the material design color swatches can be used directly through “md-color” attribute.

Which versions of Angular, Material, OS, browsers are affected?

Angular: 4.0.2 Material: 2.0.0-beta.3

[willshowell]

@ajaysattikar in some places (possibly just progress bars - see #4088), they are used as the lighter and darker hues for components. Otherwise, you can consume those colors while theming your own components:

@import 'my-theme-partial'

$primary: map-get($theme, primary);

.light-bg {
  background-color: mat-color($primary, lighter);
}
.dark-bg {
  background-color: mat-color($primary, darker);
}

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}