Allow using variables in Dark Mode color settings

Feature Requests / Improvements
1

In Bricks 2.2, we can’t currently use variables inside Dark Mode color settings. I think it would be much better if we could — it would make the color system more predictable and flexible.

Example:
I have a neutral color scale from 50 to 950. It would be so much easier if I could set
var(--neutral-950) as the Dark Mode value of var(--neutral-50), 900 → 100, etc.

That way, if I ever need to adjust my neutral palette (for example, to match a client’s slightly bluish or greenish brand tone), I wouldn’t have to manually re-input every color again. This also helpful for transparencies.

Also, the color preview already seems to recognize these variables in Dark Mode — so it feels like we’re almost there :grin:

This would make design token workflows much smoother and more scalable.

1 Like
2

Upping this. I think it’ll help setting the dark/light mode manually for every color and transparency easier

3

Yes, this is a real issue.

I want to match each light colour in a palette with a dark colour in the palette which is a standard thing to do. I’m not going to input the hsl/rbg/hex of each colour as that is unmaintainable.

When we go to select the dark mode colour there should be an easy option to select a existing palette colour either by clicking on the colour or by selecting a variable from a list of those in the palette.

Without variable support, it renders dark mode basically useless.

1 Like