Show HN: Create your own complete UI color system easy as 1-2-3

Re:Show HN: Create your own complete UI color system easy as... by presentation on Wednesday March 16, 2022 @03:05AM (#30696079)

Nice utility - I'd probably take it a step further and potentially make the default behavior be more prescriptive about locking the color values to regular steps instead of just allowing any shade of those colors. Nice to have the flexibility but I figure most people would be served better by not allowing the choice of 30 different shades of the same colors in one's app.

[ Parent | on HN ]

Re:Show HN: Create your own complete UI color system easy as... by aenero on Wednesday March 16, 2022 @04:14AM (#30696455)

Thanks for your feedback.

This area is where TypeScript would play nicely. The library implements types that fully utilize generics to define and impose restrictions for color keys, as well as ensuring type consistency across the color system. * This is the next item in my list to add to the documentation. *

So for example, you can easily implement a color system similar to Material Design 3 that only accepts these color keys: 0 | 10 | 20 | 30 ... 90 | 95 | 98 | 100. But as this is not every color system's approach, the library adopts the least restrictive default, so you can say it's less opinionated.

But for pure JS projects, custom color mapping can do the job if your design system prescribes discrete color keys for palette colors.

[ Parent | on HN ]