Learn

Color

The color fieldtype lets you add a color-picker to your Control Panel forms. Users choose colors through a Photoshop-like interface, and values can get stored in either hexidecimal, RGB, or named-color format.

For a seemingly simple field, color comes with many different settable options. All options can be set globally in the fieldtype’s configuration file, and then overridden on a field-by-field basis in your fieldset definitions.

Color Options

Choose to use a drop-down or have the color picker right in line:

select_on_page: true/false

Choose the default starting color (selected before a user triggers the pop-up):

starting_color: '#fff'

Include an input field where users can type in a value:

show_input: true/false

Choose to show the initial color in the pop-up:

show_initial: true/false

Show an alpha slider:

show_alpha: true/false

Set the words to pick a color or cancel:

choose_text: "Pick"
cancel_text: "Cancel"

Choose your preferred format to use:

preferred_format: "hex"/"hsl"/"rgb"/"name"

Palette Options

Show a color palette of pre-defined colors:

show_palette: true/false

Only show the color palette (hide the color picker)

show_palette_only: true/false

Define a list of colors to display in the pop-up palette, you can also do lists of lists if you wish to have a couple of different color palettes.

palette:
  - '#fff'
  - '#ccc'
  - '#999'

Enable a palette that will hold color selections made by the user:

show_selection_palette: true/false

Set the maximum number of user-made color selections that will show up in the selection palette:

max_selection_size: 10

Finally, you can define a key to use so that multiple color pickers will share the same selection palette. All fields that use the same key will use the same selection palette:

local_storage_key: ""

This article was last updated on March 30th, 2016. Find an error? Please let us know!