> Portal Navigation:
> 
> - Append `.md` to any URL under `https://dev.wix.com/docs/` to get its markdown version.
> - Pages are either content pages (article or reference text) or menu pages (a list of links to child pages).
> - To get a menu page, truncate any URL to a parent path and append `.md` (e.g. `https://dev.wix.com/docs/sdk.md`, `https://dev.wix.com/docs/sdk/core-modules.md`).
> - Top-level index of all portals: https://dev.wix.com/docs/llms.txt
> - Full concatenated docs: https://dev.wix.com/docs/llms-full.txt

## Resource: selectColor()

## Article: selectColor()

## Article Link: https://dev.wix.com/docs/sdk/host-modules/editor/inputs/select-color.md

## Article Content:

# selectColor()

Opens a color picker panel in the editor, prompting the user to select a color. This function is intended for use in the [settings panel](https://dev.wix.com/docs/build-apps/develop-your-app/extensions/site-extensions/site-widgets/create-a-settings-panel-for-a-site-widget-or-plugin-wix-cli-and-self-hosting.md) of a site widget or plugin implemented with a custom element.

## Syntax

```js
function selectColor(value: string, options: { onChange: (value: string) => void }): Promise<string>
```

## Parameters

| Name     | Type                               | Description                  |
|:---------|:-----------------------------------|:-----------------------------|
| `value` | string | Optional. Value of the associated `color` CSS property. |
| `options` | [SelectColorOptions](#selectcoloroptions-object) | Optional. Options to use when opening the color picker panel. |

### SelectColorOptions object

```ts
{
    onChange: (value: string) => void
}
```

| Name | Type | Description |
|---|---|---|
| `onChange` | Function | Optional. Callback function invoked when the color selection changes. It receives the updated color value as a parameter. |

## Returns

`Promise<string>`

The color selected by the user.

## Example

```js
import { editor, inputs } from "@wix/editor";
import { createClient } from "@wix/sdk";

const client = createClient({
  host: editor.host(),
  modules: { inputs },
});

async function selectColor(color) {
  const response = await client.inputs.selectColor(color, {
    onChange: (value) => {
      console.log("New color: ", value);
    },
  });
}
```