Skip to content

Custom color palette

Our Custom Color Palette feature allows you to define and display your brand’s preferred colors directly in the color picker within the template editor. This makes it much easier for designers and marketers to maintain a consistent look and feel across all email templates.

Set custom colors

To define your custom colors, simply add the colors array to your TOPOL_OPTIONS configuration when initializing the editor:

ts
colors: ["#000000", "#ffffff", "#ffc000"],

Each value in the colors array should be a valid hex color code (e.g., #ffffff for white, #000000 for black).

Once configured, your defined colors will appear:

  • In the color picker for text, backgrounds, buttons, dividers, and other design elements.

  • As clickable swatches for fast access — helping users avoid typing or manually selecting colors repeatedly.

Color Picker with custom colors inside