How to set text color in Angular-Material?

Maor picture Maor · Feb 12, 2015 · Viewed 61.9k times · Source

I want to set one word in a sentence to have md-primary color, and another word to have the accent color. I assumed something like this:

<div>
    Hello <span class="md-primary">friend</span>. 
    How are <span class="md-accent">you</span>?
</div>

But those classes work only for some specified components.

What's the way to do it?

Answer

coblr picture coblr · Jun 9, 2016

I was just able to do this using Angular Material 1.1.0.

You use the md-colors directive similar to how you would ng-class:

<span md-colors="{color:'primary'}">...</span>

The above code will color the text the primary color. The object that you pass to md-colors uses the key as the css property (i.e. 'color', 'background', etc) and the value as the theme and/or palette and/or hue you want to use.

Source Docs