Elementor: Set Color Dynamically Using ACF Field

A work round for a feature not yet supported by Elementor:-

Ok, this is a very dirty fix but it works sweat_smile

Add a ‘Shortcode’ widget to your page or template and wrap your shortcode into the following code:

<style type="text/css">
.element-to-style {
background-color: [my_shortcode field="color"];
}
</style>
Let’s say you want the background color of a column to change (assuming you’re using ACF and you’ve named your field ‘color’):

<style type="text/css">
.elementor-123 .elementor-element.elementor-element-b9b3a8f:not(.elementor-motion-effects-element-type-background) > .elementor-element-populated, .elementor-123 .elementor-element.elementor-element-b9b3a8f > .elementor-column-wrap > .elementor-motion-effects-container > .elementor-motion-effects-layer {
background-color: [acf field="color"];
}
</style>

Original source: https://github.com/elementor/elementor/issues/6923