search

material-foundation / material-color-utilities

Color libraries for Material You
Apache License 2.0
1.57k stars 134 forks source link

How do I create complete Material color palette with shades 90-900, with accent shades? #135

Open micobarac opened 6 months ago

micobarac commented 6 months ago

How do I create complete Material color palette with shades 90-900, with accent shades, from a single color?

I need color shades 90-900 with A100, A200, A400, A700 accent shades, to define Angular Material Theme.

Other than that, how to include the original color in the palette? Most of the time, generated color palette doesn't include the original color.

Kyant0 commented 2 weeks ago

Use like HCT(hue=sourceColor.hue, chroma=48.0, tone=t).toArgb(), where t={0,10, 20,...} corresponding to {A1000, A900, A800,...}

peteroupc commented 1 week ago

Another question of interest is how the original Material Design color palette was generated; was a similar approach as HCT taken there?

Kyant0 commented 1 week ago

The method I say is the original generation method. But in the current palette we don't have the concept of A1000,... We only have "color roles", such as primary, primary container, they can't be accurately mapped from the legacy A400,... If you have read the source code, you will find it's relation to background color, contrast curve, and so many things, which can't be represented by A1000,...