---
title: Palette
description: The Palette app adds a field type for selecting a color from a predefined set of hex values.
url: https://www.storyblok.com/docs/apps/palette
---

# Palette

The Palette app adds a field type that presents a fixed set of colors as a visual palette. Use it to keep styling choices such as button, heading, and background colors within a defined brand palette. The field stores the selected hex value.

## Features

-   Define the set of colors editors can select.
-   Set a default color.
-   Choose between a small, medium, or large swatch size.
-   Deselect the current color.

## Setup

In the **Block Library**, select the block you want to edit, add a field, set its field type to **Plugin**, and set the custom type to `storyblok-palette`.

The field takes the following options:

| Option | Type | Description |
| --- | --- | --- |
| `colors` | JSON | Array of hex strings, for example `["#00B3B0", "#40C6C4"]`. |
| `defaultValue` | String | Hex value selected when the field is empty. |
| `size` | String | Swatch size: `small`, `medium`, or `large`. |

## Further resources

[Palette in the app directory](https://www.storyblok.com/apps/storyblok-gmbh@palette)

## Pagination

-   [Previous: Optimizely](/docs/apps/optimizely)
-   [Next: Pipelines](/docs/apps/pipelines)