# Color picker into custom module

**URL:** <https://community.hubspot.com/t/color-picker-into-custom-module/3447>\
**Category:** CMS Development\
**Created:** [September 27, 2017, 7:45am UTC](https://community.hubspot.com/t/color-picker-into-custom-module/3447 "2017-09-27T07:45:06Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![PEF](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/pef/32/14727_2.png) [@PEF](https://community.hubspot.com/u/PEF)\
**Post date:** [September 27, 2017, 7:45am UTC](https://community.hubspot.com/t/color-picker-into-custom-module/3447/1 "2017-09-27T07:45:06Z")

</div>

Hello,

Do you know if it is possible to add a color picker into custom modules? I want to give the user the choice to edit the background color of my email cover directly into the content editor. Otherwise, How can I set the color background of the custom module directly into the template? thanks for your feedback.

Thakns for your helps!!

---

<div class="post-metadata">

**Author:** ![Jsum](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/jsum/32/20405_2.png) [@Jsum](https://community.hubspot.com/u/Jsum)\
**Post date:** [September 27, 2017, 7:58pm UTC](https://community.hubspot.com/t/color-picker-into-custom-module/3447/2 "2017-09-27T19:58:59Z")

</div>

@PEF,

Is it a set list of of colors? I’ve done this before with a set list of colors using a choice module. You would have to set the colors inline instead of in a style sheet (or in the head, but I don’t think I’ve tried this). set the color value to either the choice module containing the choices and set to no\_wrapper-True, or set the choice module to export\_to\_template\_content=True and set the value token for the choice as the color value.

In the editor there will be a drop down, choosing a color from the drop down will apply that color value to whatever element’s css attrubute you are wanting to change.

```auto
<div style="background: {% choice 'bg_color' label='div BG Color', value='#fff', choices='#fff, #f3f3f3, #bbb, rgba(155,245,67,.8)', no_wrapper=True %}'>

</div>

{% choice "bg_color" label="div BG Color", value="#fff", choices="#fff, #f3f3f3, #bbb, rgba(155,245,67,.8)", export_to_template_context=True %}

<div style="background: {{ widget_data.bg_color.value }};">

</div>

```

If you are using the template builder you can place either of these in the css settings for a module/wrapper.

In all cases you should be hyper sensitive to nesting quotations.

---

<div class="post-metadata">

**Author:** ![PEF](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/pef/32/14727_2.png) [@PEF](https://community.hubspot.com/u/PEF)\
**Post date:** [September 29, 2017, 10:02am UTC](https://community.hubspot.com/t/color-picker-into-custom-module/3447/3 "2017-09-29T10:02:31Z")

</div>

hi Jsum, thanks for your help. i was rather thinking of a color picker. But I’kll try your way.

thanks a lot!

---

<div class="post-metadata">

**Author:** ![Jsum](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/jsum/32/20405_2.png) [@Jsum](https://community.hubspot.com/u/Jsum)\
**Post date:** [September 29, 2017, 3:44pm UTC](https://community.hubspot.com/t/color-picker-into-custom-module/3447/4 "2017-09-29T15:44:57Z")

</div>

Hubspot doesn’t have a color picker module unfortunately. any solution you find will be a hack.

---

<div class="post-metadata">

**Author:** ![dmcn](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/dmcn/32/74736_2.png) [@dmcn](https://community.hubspot.com/u/dmcn)\
**Post date:** [May 30, 2018, 6:23pm UTC](https://community.hubspot.com/t/color-picker-into-custom-module/3447/5 "2018-05-30T18:23:36Z")

</div>

> **[HubL standard tags - HubSpot docs](https://developers.hubspot.com/docs/cms/reference/hubl/tags/standard-tags)**
>
> Reference documentation for syntax and available parameters for all HubL tags.

Is there an example on how to use this within a template?  
Understand it’ll only apply to the page and accessible to a hubspot user, but would like to get a color picker setup.