The Color Picker tool (see Fig 1 below) is accessed via the Color and Fill features, and allows you to change the color of an element's text or background.
Fig 1
The Color Picker tool provides several ways to modify the color of an element, which will be described in detail below.
- The top section of the Color Picker tool (see Fig 2 below) includes a large color swatch area that offers a range of shades and saturation for the selected color. By left clicking and holding the small hollow circle icon, you can drag it over the swatch area to select a shade.
Just below the swatch are two slider bars. The top slider allows you to change the general color of the swatch, while the lower slider bar allows you to select the opacity of the element. By default, the slider will be set to the far right, making the element 100% opague. Moving the slider control to the left reduces the opacity until it hits "00", indicating the element will be fully transparent.
Fig 2
- In the middle of the tool is an input field that allows you to input an exact color code. By default, the input tool will be set to "hex code" format. You can enter a six-character code to select a specific color, or an eight-character code to also indicate opacity. See figure 3 below.
Using the up/down arrows to the right of the input field, you can switch from "hex code" format to "RGBA" format (see Fig 4 below) or "HSLA" format (see Fig 5 below).
Fig 3
Fig 4
Fig 5
- The lower section of the tool shows a palette of preset colors you can choose from, with the "preset" icon checked. See Fig 6 below.
Fig 6
You can also check the "local" icon, which will bring up a palette of custom colors you have added. To add a new color, enter its value ("hex", "RGBA", or "HSLA") in the color input field, then click the green circle with the "+" in its center. The color will now be added to the "local" color palette, and be available anywhere within this landing page. See fig 7 below.
Fig 7
Another option is the "global" icon, which brings up a palette of colors that are available for any landing page created in the account. See Fig 8 below.
Fig 8