Volumetrics-io / mrjs

An extensible WebComponents library for the Spatial Web
https://mrjs.io
MIT License
148 stars 9 forks source link

Expose CSS colors to the Javascript API #594

Closed lobau closed 2 months ago

lobau commented 2 months ago

CSS has very powerful color declaration:

:root {
    --accent: #ff0000,
    --disabled: darkGrey,
    --bgColor: hsl(50 80% 40%),
    --foo: color-mix(in lch, plum 40%, pink);
}

which is great because it's easy to use on various MRjs elements, like

myEntity.style.backgroundColor = var(--bgColor);

unfortunately, it is not possible to use those colors in many Three.js specific contexts, like when i have to color a material:

myEntity.color.setStyle("#f90");

I would love to be able to use all my CSS colors. A good way would obviously be to support CSS for all the places you can set colors, but maybe a simpler alternative would be to store all the CSS variables and allow me to query those variables using JavaScript.