2
votes

Material.io has this great tool called the Material Palette Generator: https://material.io/design/color/#tools-for-picking-colors. Using it, you can pick a primary and secondary color, and then click a link "View in Color Tool" which takes you to a page where you can see your choices in different ways: https://material.io/resources/color/#!/?view.left=0&view.right=0&primary.color=6002ee&secondary.color=c63131.

But there doesn't seem to be an easy way of exporting your palette into a format usable for generating a custom Angular Material theme. They have an export link, but the closest format seems to be CodePen. But once you open it in CodePen, the CSS doesn't seem to have the palette information you need.

My question: has anyone tried these tools, and is there a pre-established pathway from Material palette to Angular Material custom theme? Or are they unrelated? If unrelated, is there a simple way to copy the color codes needed from the former to the latter?

Thanks.

1
The export link was designed for AngularJS Material, the predecessor of Angular Material. - Edric

1 Answers

3
votes

You can use this website for generate a material color. For you only need a hex code, and after this you can generate the expected color format.

Expected color format: Excepted format Generated result: enter image description here