Color Picker Dialog

The square displays a gradient of colors related to the one currently selected, which is indicated by the small circle. You can click in the square to choose a different color. You can also click in vertical color bar to change the square to a different range of colors.

Displays the most recent colors that you have used. To use one of these colors, click it.

Displays CSS variables (e.g., branding colors) in the project. To use one of these colors, click it.

Displays the colors that you have added by clicking the Save button . To use one of these colors, click it. The "Saved" list is a way to create a list of your favorite colors so that it is easier to find and select them in the future.

Displays the named colors in the system. To use one of these colors, click it.

Displays a list of web-safe colors. To use one of these colors, click it.

Displays the hexadecimal number for the color after you select it. For example, the hexadecimal number for "Blue" is #0000ff.

Adds the selected color to the "Saved" list. This is a way to create a list of your favorite colors so that it is easier to find and select them in the future.

Adds a bar above the cursor. As you move the cursor over any area of your screen, the color changes in the bar to reflect the color that is directly behind the tip of the cursor. When you click, that color is loaded into the Color Picker dialog.

Displays the percentage of hue for the color in the RGB model. Hue is the wavelength within the visible light spectrum.

Displays the percentage of saturation for the color in the RGB model. Saturation is the relative bandwidth of the visible output.

Displays the percentage of brightness for the color in the RGB model. Brightness is the intensity of the energy output.

Displays the amount of red in the selected color. (Each color is a combination of a certain amount of red, green, and blue.) You can manually change this number, which will result in a different color being selected.

Displays the amount of green in the selected color. (Each color is a combination of a certain amount of red, green, and blue.) You can manually change this number, which will result in a different color being selected.

Displays the amount of blue in the selected color. (Each color is a combination of a certain amount of red, green, and blue.) You can manually change this number, which will result in a different color being selected.

Activates the C, M, Y, K fields below so that you can use the CMYK color model. CYMK is an acronym for the four primary colors used in printing (Cyan, Magenta, Yellow, and Key—or black). Whereas CMYK is often the preferred model for print-based output, the RGB (Red, Green, Blue) model is primarily intended for electronic content.

Displays the percentage of cyan that makes up the color.

Displays the percentage of magenta that makes up the color.

Displays the percentage of yellow that makes up the color.

Displays the percentage of black that makes up the color.

Displays the color currently applied to the element.