# Delicate Colour related CSS

**URL:** <https://community.hubspot.com/t/delicate-colour-related-css/136083>\
**Category:** CMS Development\
**Tags:** css\
**Created:** [July 11, 2025, 2:47pm UTC](https://community.hubspot.com/t/delicate-colour-related-css/136083 "2025-07-11T14:47:34Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Jopitts](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/jopitts/32/44643_2.png) [@Jopitts](https://community.hubspot.com/u/Jopitts)\
**Post date:** [July 11, 2025, 2:47pm UTC](https://community.hubspot.com/t/delicate-colour-related-css/136083/1 "2025-07-11T14:47:34Z")

</div>

Hi all.

I’ve got a tricky problem (I think). You experts may have a brilliant solution.

I have client that is using a set of HS Web Templates that have all the colours done as choices with the colour names listed as the display values, and the data values set to CSS variable names. Pick your colour, and magically from the CSS variable, the colour gets applied.

Now, here in lies the problem. The client wants to move away from that to regular colour pickers. In and of itself that’s not hard. What is hard (I think) is not breaking every colour on site.  
If I replace the choice variable with a colour picker variable in every module, then I presume every page on site will revert to the default values in the colour picker? Is that correct? If so, any brilliant ideas on how to get around it?

---

<div class="post-metadata">

**Author:** ![Anton](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/anton/32/103167_2.png) [@Anton](https://community.hubspot.com/u/Anton)\
**Post date:** [July 11, 2025, 3:22pm UTC](https://community.hubspot.com/t/delicate-colour-related-css/136083/2 "2025-07-11T15:22:08Z")

</div>

Hey @Jopitts,

reverting from a choice field to color picker comes down to the setup.  
If the colors are set as values in the choice fields, you can replace them easily and set the selected color as a default value of the color picker.

If it’s done differently - I know that there are different ways, because I’m using a somewhat over-engineered one for my own clients - it might be a lot more work to “detangle” it.  
My recommendation would be to clone the theme into a CMS sandbox/dev test account, change everything, test it and once you’re done, move it back to the live portal

If you have no CMS sandbox/dev test acc:  
head over to [developers.hubspot.com](http://developers.hubspot.com), create a free app test account, once logged in, create a test account. It’s the CMS sandbox. Basically an Enterprise level account without features to use it as a live one. But it’s perfect for dev stuff

best,

Anton

---

<div class="post-metadata">

**Author:** ![Jopitts](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/jopitts/32/44643_2.png) [@Jopitts](https://community.hubspot.com/u/Jopitts)\
**Post date:** [July 11, 2025, 3:57pm UTC](https://community.hubspot.com/t/delicate-colour-related-css/136083/3 "2025-07-11T15:57:15Z")

</div>

Anton,

thanks for the response.

The problem I see is that it’s not just the templates that will need updating, but every deployed module.

If I’m right, that’s gonna be a HUGE job. Please tell me I’m not right!

---

<div class="post-metadata">

**Author:** ![Anton](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/anton/32/103167_2.png) [@Anton](https://community.hubspot.com/u/Anton)\
**Post date:** [July 11, 2025, 6:31pm UTC](https://community.hubspot.com/t/delicate-colour-related-css/136083/4 "2025-07-11T18:31:00Z")

</div>

Hey @Jopitts,  
what’s the setup?  
If the choice fields are all set up individually per module, unfortunately you’ll have to tackle this HUGE job…  
If the choice fields are handling CSS classes which are generated in one place (i.e. a helper.css file), you could do it differently.  
Also, maybe - just maybe the dev used [fields.js](https://developers.hubspot.com/docs/guides/cms/content/fields/write-fields-using-javascript). If you could get the original files to you, it could be changed in one file (if it’s set up like this), compiled again and you’re good. If not - you’re gonna have to go the long route and change every color in every module… 😞

best,

Anton
