Allow us to use CSS variables in the color picker

[azkalex]

Prerequisites

• I have searched for similar feature requests in both open and closed discussions and cannot find an existing request.
• I have verified that the feature is still missing from the latest stable versions of Elementor or Elementor Pro.

What problem is your feature request going to solve? Please describe..

Using the global colors always outputs weird color vars names. Besides having that, we should also be able to use our own color vars in the color picker as in the image below.

Describe the solution you'd like.

It should just work, global colors are vars themselves too, so it should work the same way even if the custom var is specified or being chosen from the global colors.

Describe alternatives you've considered.

Custom CSS on the DOM elements that need to have those color vars.

Additional context

No response

Agreement

• I agree that my request may be closed without action if it doesn't meet all the requirements.