feat(css): add color-mix() tool

[OnkarRuikar]

• related to https://github.com/mdn/content/pull/34371

The PR adds a tool to experiment with the CSS color-mix() function. Following is the screenshot of the tool:

[bsmth]

Thanks, @OnkarRuikar. Looking good! I made some suggestions on a branch, do you want to have a look here:

https://github.com/OnkarRuikar/css-examples/compare/css_color_mix...bsmth:css-examples:css_color_mix_brian?expand=1

• monospace font for readability of the <label>s.
• Change event listeners to use input so we have faster feedback
• Flex for alignment
• Some margin to give the calc / output some breathing room

[bsmth]

And just general question; why do we want to include Pickr? Not a blocker, just curious 🤔

[OnkarRuikar]

I've applied the changes.

And just a general question; why do we want to include Pickr?

Because HTML color input doesn't support alpha(transparency) channel: https://github.com/whatwg/html/issues/3400#issuecomment-606737019 .

[bsmth]

I've applied the changes.

Nice, taking a look again!

And just a general question; why do we want to include Pickr?

Because HTML color input doesn't support alpha(transparency) channel: whatwg/html#3400 (comment) .

Ah-ha, thanks for the hint 👍🏻

[OnkarRuikar]

LGTM, only last thing to think about is demonstrating that the percentage doesn't have to be a whole number;

:nerd_face: done.

[bsmth]

Merging now, thank you!