Color field
The new color field comes with support for hex, rgb and hsl modern CSS notation.
Usage
color:
type: color
format: hsl # supports hex (default), rgb, hsl
Pre-defined options
Allows adding a list of pre-defined colors that are shown as one-click options in the Panel.
color:
type: color
options:
- "#f8b195"
- "#f67280"
- "#c06c84"
- "#6c5b7b"
- "#355c7d"
If you name the colors, their name is shown in the Panel as well.
color:
type: color
options:
"Sunny rays": "#F8B195"
"First-love blush": "#F67280"
"Cherry blossom": "#C06C84"
"Morning gloom": "#6C5B7B"
"Midnight rain": "#355C7D"
Modes
With the mode option you control which elements of the color field are available. Possible values:
| Option | Description |
|---|---|
picker |
show everything (default) |
input |
show only the input |
options |
show only options |
Alpha
Use the alpha option (default: false) to activate alpha transparency support:
color:
type: color
alpha: true