bgrins / TinyColor

Fast, small color manipulation and conversion for JavaScript
https://bgrins.github.io/TinyColor/
MIT License
5.08k stars 438 forks source link

HWB Colors #143

Open thaliaarchi opened 8 years ago

thaliaarchi commented 8 years ago

HWB (Hue, Whiteness, Blackness) colors are now a suggested standard for CSS4. That means that it could potentially very useful to include this in tinycolor. I am aware of the proposed extensions API from #135, but if this is added to CSS4, then this should be in tinycolor.

According to Wikipedia, the conversion between HWB and HSV is very simple:

HWB to HSV

H=H
S=1-W/(1-B)
V=1-B

HSV to HWB

H=H
W=(1-S)*V
B=1-V

Reference http://www.w3schools.com/colors/colors_hwb.asp https://en.wikipedia.org/wiki/HWB_color_model

thaliaarchi commented 8 years ago

As of now, I think this feature should be postponed until it is finalized in CSS4 and has some browser implementation. On a side note, gray(), cmyk, lab(), and lch() are also in the CSS Color Module Level 4, so those should also be added when hwb is implemented.

https://drafts.csswg.org/css-color/

bgrins commented 8 years ago

Thanks for the heads up. Let's keep an eye on the spec and implement it if it gets finalized there. It'd still be nice to have the extension API (even if it is ultimately going to ship by default) so we could implement it ahead of time.

bgrins commented 1 year ago

This has been shipped in the spec https://www.w3.org/TR/css-color-4/#the-hwb-notation. It looks like parsing the syntax is a bit different with the alpha channel. Example from mdn (https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/hwb):

hwb(194 0% 0%) /* #00c3ff */
hwb(194 0% 0% / .5) /* #00c3ff with 50% opacity */