How to create background color changable module.

I am creating module۔ a module with changeable background color

Hi @MHussain8,

You can make use of style fields in your module choosing to add a color field into the style fields. Whether you add this into the Style fields section or just the regular fields section on the right hand side when building out the module, you will need to reference that field’s value in your code to take advantage of this.

So with a simple example of you creating a color field for the module with the HubL variable name background_color, your code might look something like:

{% set background_color = module.background_color.color %}

<style>

.your-class {

background-color: {{background_color}};

}

</style>

This will apply the color from the module’s color picker to the background-color of any element with class=“your-class”. Let me know if this helps or if you had something else in mind here when you mentioned changeable background color :slightly_smiling_face: