what is colors in (MDL) ?

• Material Design Lite has two palette Color primary and accent, the user has an option to customize the color combination using Selector Tools.
• To Select the desired Color Combination, use the Custom CSS theme builder

Material Design Lite : Usage of Color Palettes

• In the Demo, we Create Tabs using the Color Pallete with combination of colors red and purple
• The Pattern of the color palettes in the file name is as follows material.{primary}-{accent}.min.css eg material.red-purple.min.css

Sample code: Color Palettes

<!-- Raised button , class "mdl-button--colored"-->
<button class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored">
  Button
</button>
     
  <!-- Raised button , class "mdl-button--accent"-->
<button class="mdl-button mdl-js-button mdl-button--raised mdl-button--accent">
  Button
</button>
     
<!-- Raised button with ripple , class "mdl-js-ripple-effect" -->
<button class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent">
  Button(ripple)
</button>

<!-- Raised disabled button , attribute "disabled" -->
<button class="mdl-button mdl-js-button mdl-button--raised mdl-button--accent" disabled>
  Button(Disabled)
</button>

This material design lite tutorial provides you the basics on the following areas android material design , google material design , material ui , google design , amg lite , bootstrap material design , mdl , materialize css , cool material , material design list , material design website , material design cards , material design ui , material design web , material design apps , material design tutorial , angular material design , material design table , material design angular , material design examples , material design theme , material design animation , material design css , what is material design , material design framework , material design buttons , material design template , material design components , google material design colors , material design google , material design light