How do I customize Angular Material's input/md-input-container component?

Question

As stated in the title, how do I customize these elements? It seems they are using transparent background which is very difficult to view on most background palettes

Answer 1

Add one blank css file after "angular-material.css" and inside that blank css file overwrite the rules you want to customize.

For the problem you are facing I added the following rules in my custom.css.

md-input-container.md-default-theme label, 
 md-input-container.md-default-theme .md-placeholder{
    color:grey !important;
}

Here you could change color or background-color as you like.