> ## Content Index
> Fetch the complete content index at: https://getpublii.com/dev/llms.txt
> Use this file to discover other available public pages before exploring further.

# Color picker

- URL: https://getpublii.com/dev/color-picker/
- Published: 2019-03-23T13:57:48.767Z
- Updated: 2025-01-19T09:16:20.428Z
- Description: The color picker allows you to easily select a color value instead of manually using a hex code. The basic syntax for the color picker…
- Author: Tomasz Dziuda
- Tags: Fields, Theme Settings API

The color picker allows you to easily select a color value instead of manually using a hex code.

The basic syntax for the color picker is very simple:

```json
{
    "name": "primaryColor",
    "label": "Primary color",
    "group": "Colors",
    "value": "#E7AE12",
    "type": "colorpicker",
    "outputFormat": "HEX"
}
```

The available options:

-   RGBA or HEX *(default)*
-   RGBA
-   HSLA

When RGBA or HSLA is selected, the formatting in the control cannot be changed - there will always be inputs for RGBA or HSLA.

The above code will generate a color picker UI with the label "Primary color" and default color set to **#E7AE12**

![Color Picker](https://getpublii.com/dev/media/posts/113/color-picker.svg)