27
Custom colour for angular material components
So, you have an angular material component, say a chip or a button like so:
<button mat-flat-button> Done button>The designs provided to you show that the background colour of the button should be green and the text should be white.
You frantically search the web for a solution. Look no further !
You frantically search the web for a solution. Look no further !
In your corresponding styling file (
.css or .scss), include the following style selector:.mat-green {
background-color: green;
color: white;
}And then, in your
.html file, simply set the color input attribute to green as below:<button mat-flat-button color="green"> Done button>And voilà ! There you have it.
Note: You can provide any name to the css selector and prefix it with
mat- and set the name to the color attribute.27