How do I change the colors of a standard HubSpot theme?

Last updated: May 23, 2017

Available For:

Marketing: Basic, Pro, Enterprise
Sales: N/A
Service: N/A

In the standard HubSpot themes, colors are defined in HubL variables toward the top of the [nameofhubtheme]-style.css file. Changing the HEX values in quotes (i.e. "#666") and republishing the CSS file will alter the colors used throughout your theme. To change a color:

  • Navigate to Content > Design Manager.
  • Click Coded files in the left sidebar menu and locate the [nameofhubtheme]-style.css file.
  • Under Variables in the file, scroll to Colors and update the applicable HEX color(s). Please take note that making syntax mistakes in these HubL variables can cause an error when you publish. When making edits to these color variables, make sure you are only changing the value in quotation marks.
  • Click Publish.
Color variables

Was this article helpful?