Angular Material adding the primary color to a Div

Question

I am using Angular Material 2 and I am trying to add the primary color to a div.

This is what I've done:

<div class="myDiv background-primary-color white-text">This is a Div</div>

The problem I'm having is that It's adding no color to it.

Answer 1

There is no way to use color attribute on non-material elements (and not all Angular Material elements support it). But you can follow a little hacky way: import a palette and store the color to the variable in SASS/LESS, so when you will change the current palette - this color will be changed too. Here is an awesome explanation step by step: https://stackoverflow.com/a/46760925/6053654