When adding color to your text, icons, buttons, borders, text shadows, and more, the color picker (or color dropper) allows you to easily customize and select from a wide range of colors.

COLOR PICKER

To adjust the color setting for any page element or tool, click the color picker icon from the settings panel:

From the color selection window, you can move the radio button to select your desired color:

Use the opacity slider to adjust the opacity (which uses the RGB alpha channel):

You may also use the saturation slider to adjust the saturation:

Color presets are any saved colors in your palette, which can include default system colors and any custom colors you have opted to save:

All presets can be reviewed by clicking the COLOR PRESETS menu option:

To add a customized color to your palette, simply select the desired color, adjust its opacity and saturation (if desired), then click the + icon:

Once your color has been added, you will see a confirmation message:

Newly added colors will appear at the end of the presets list:

A color gradient is a style in which the selected color is lighter on top and darker on the bottom. When adding rows or columns to your lesson pages, you can add color gradients to the background to increase visual interest to your page. To add a gradient to your column, hover over your desired column, click the Edit Column option, then select COLUMN SETTINGS:

From the settings menu of your column, locate the BACKGROUND > TYPE setting, and select GRADIENT:

From the Background Gradient section, you can choose a linear or radial gradient. When selecting a linear gradient, you can:

• Adjust the gradient angle
• Select the first color for your gradient
• Select the first color stop
• Select the second color for your gradient
• Select the second color stop

The color stop defines where the gradient starts and stops on the gradient line.

Below are some examples of linear gradients:

• A linear gradient, set to an angle of 0, with the first color stop at 0% and the second color stop at 100%:

  

• A linear gradient, set to an angle of 180, with the first color stop at 0% and the second color stop at 100%:

  

• A linear gradient, set to an angle of 90, with the first color stop at 30% and the second color stop at 70%:

  

When selecting a radial gradient, you can:

• Adjust the gradient locus
• Adjust the gradient locus
• Select the first color stop
• Select the second color for your gradient
• Select the second color stop

Below are some examples of radial gradients:

• A radial gradient, set to a locus of Center Center, with the first color stop at 0% and the second color stop at 100%:

  

• A radial gradient, set to a locus of Center Center, with the first color stop at 30% and the second color stop at 80%:

  

• A radial gradient, set to a locus of Left Top, with the first color stop at 0% and the second color stop at 100%:

  

• A radial gradient, set to a locus of Left Top, with the first color stop at 30% and the second color stop at 80%: