A hex code is a 3-byte hexadecimal number used in HTML, CSS, and other applications to represent colors. They will start with a hashtag (#) and are followed by 6 digits, using either numbers, letters (A - F), or a combination of both.
When you select a color of a font, border, or background in a campaign or form created in ActiveCampaign using the color picker, we’ll display the hex code for you. In addition, if you already know what hex code to use in your forms and communications, we make it easy for you to apply that code. Doing so allows you to use specific colors in your forms and communications that are associated with your brand.
If you would like to learn more about hex color codes and how they are generated, click here.
How to use hex color codes in campaigns and automation emails
In campaigns and automation emails you can use hex colors on the following items:
- Font color
- Background color for all content blocks
- Border color for all content blocks
- Column color for all content blocks
- Font color (when applicable)
- Custom HTML block
- When creating an email using your own custom code
There are slightly different ways to apply hex codes in the Email Designer (launched 2022) and the Classic Designer. Click below to learn expand the information to learn more:
Note that with the Email Designer, you can update the Global Settings in your campaign to set the overall appearance, including colors, before you apply individual settings. Learn more about the available options to customize in the Global Settings tab. You can use the following instructions to update the hex colors for those options as well.
To change the color of your font in a single text block using the Email Designer (launched 2022):
-
Click the text block with the font you would like to update then to the right, click into the Text color field. Note that you can also change the color of the block background by clicking Background color any links in the text box by clicking into Link color.
- Select colors by either typing in the hex code in the field or clicking the "Custom" tab in the color picker, then clicking within the color square and bar in the modal that appears.
- Your changes will be saved automatically.
To add change the color of your font with the Classic Designer, simply click that text block and click the color picker from the modal toolbar.
You can then select from additional colors or click the “More” link to select from even more colors or add your own hex color code:
To add your own hex color code to any specific block, such as a block border or to add a background color, click on that specific block:
When you do, we’ll display an options menu to the right of your screen:
Here you can type your hex code directly into the color field you wish to change, or, select a new color from the color picker.
If you have a specific hex code to use for your border or column background, click the color picker to enter your code.
How to use hex color codes in forms
In forms you can use hex colors on the following items:
- Form background color
- Form font color
- Form border color (inline forms)
- Submit button background
- Submit button font
- Submit button border
- Custom CSS blocks
To add your own hex color to your form, click the “Style” tab. Then add your Hex code anywhere there is an option to edit the color field. For example, here is the color editor in the "Text" Section of the "Style" tab: