search

bgrins / TinyColor

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

Doesn't work with calc #240

Closed geoffreysflaminglasersword closed 1 year ago

geoffreysflaminglasersword commented 1 year ago

I've gotten a CSS Property value (which I have no control over) which happens to be defined as hsl( 201, 17%, calc(60% - 5%) ), sadly it looks like TinyColor doesn't support having calc expressions

bgrins commented 1 year ago

Yeah, unfortunately for that case it doesn't evaluate CSS and adding that would be out of scope for the library. I'd try to find a way to convert it into a plan object or string first. Maybe something DIY with https://github.com/csstree/csstree - or easier if you are running in a browser environment would be to rely on the browser to evaluate it for you, giving you a result to pass into the library: 

document.body.style.backgroundColor = "hsl( 201, 17%, calc(60% - 5%) )";
window.getComputedStyle(document.body).getPropertyValue("background-color"); // "rgb(121, 146, 160)"