# Color Swatches

The Color Swatches section in the Tools Inspector lets you visually find web values for colors, save commonly used colors, and insert them into your document.

  1. Swatches: These are all the swatches available for saving colors. They come pre-populated with the rainbow.

  2. Selected Swatch: Clicking on a particular swatch will fill in its value into the Color Text Field and Selected Color Well. Double-clicking on the swatch will insert it into the document.

  3. Insert Button: This will insert the color's value from the Text Field into the cursor position of your document.

  4. Color Text Field: This field represents the text representation of the color from the Selected Color Well. It is bidirectional, so you can also type in this field to update the color in the well. It accepts 3-digit hex, 6-digit hex, 8-digit hex, rgb(), rgba(), and named colors.

  5. Selected Color Well: Clicking this will open the standard macOS Color Picker as a Pop Over window. When a color is selected, it will show up in the well and show the text value in the Color Text Field. The color can be added to the swatches by dragging from the well to the desired color swatch.


To quickly test different colors in your document, select the text for the color in the Source Editor. When the Insert Button is used, it will replace the selected text with the new color and also preserve the selection, so each new insertion will let you immediately try the new color.