Choosing and Saving Colors with the Color Picker

The Color Picker is the single place to set every color on a page, from section backgrounds to one highlighted letter. It shows brand colors, default colors and your own saved colors together.

Open the Picker

1. Open a funnel or website page and select a section, element or text block.
2. Click the color square in the style panel, or the A icon in the text toolbar.
3. Pick any swatch from the palette.

Create a Custom Color

1. Press + Add.
2. Choose a shade and select a format: HEX (such as #1E90FF), RGB, or Custom for a dynamic value like {{ custom_values.primary_color }}.
3. Type a descriptive label such as "CTA Blue".
4. Click Save. The new swatch joins your palette, and its label appears as a tooltip on hover.

Using a custom value means you change the color in one place and everything referencing it follows.

Safeguards

• A custom value must already exist in your account's Custom Values before it can be saved.
• Saving a shade that is already in the palette is flagged so you do not end up with duplicates.
• Renaming or deleting a swatch never changes colors already applied to pages. Editing a brand color affects only future use.

Extra Details

• Color single words or characters from the inline text toolbar.
• Buttons have an independent Icon Color, separate from text and subtext.
• Brand colors added to your Brand Board show at the top of the palette.
• Default palette colors can change when new starter designs are released, so choose brand or custom swatches for strict consistency.

Good to know: Name your colors by purpose (Warning Red, Primary CTA) rather than by shade so teammates choose the right one.