The set of colors that Color.js can parse and that browsers can parse are overlapping but not identical, and neither is a subset of the other.
Color.js understands color spaces that browsers do not, but also browsers support things like color-mix(), CSS variables, relative colors etc.
A big improvement would be to introduce an extra step: If parsing fails, try CSS.supports('color', color). If that is true, use getComputedStyle() to resolve color (demo), then proceed as normal. getComputedStyle() calls are expensive, so it's important to keep them to a minimum and cache the results.
The set of colors that Color.js can parse and that browsers can parse are overlapping but not identical, and neither is a subset of the other.
Color.js understands color spaces that browsers do not, but also browsers support things like
color-mix(), CSS variables, relative colors etc.A big improvement would be to introduce an extra step: If parsing fails, try
CSS.supports('color', color). If that is true, usegetComputedStyle()to resolve color (demo), then proceed as normal.getComputedStyle()calls are expensive, so it's important to keep them to a minimum and cache the results.