[**Kvaser CanKing GUI Extensions SDK v7.5.1**](../../README.md)

***

[Kvaser CanKing GUI Extensions SDK](../../modules.md) / [controls](../README.md) / ColorControlProps

# Interface: ColorControlProps

Properties of the ColorControl React component.

## Properties

### anchorOrigin?

> `optional` **anchorOrigin**: `PopoverOrigin`

The origin for the popover that contains the color picker. Default is { vertical: 'bottom', horizontal: 'left' }.

***

### color

> **color**: `string`

The currently selected color in hex string format or a color name (e.g., "#RRGGBB" or "#RRGGBBAA" or "red").

***

### onChange()

> **onChange**: (`color`) => `void`

A callback that will be called when the user selects a new color.

#### Parameters

##### color

`string`

The newly selected color in hex string format.

#### Returns

`void`

***

### predefinedColors?

> `optional` **predefinedColors**: `string`[]

Optional predefined colors that the user can select from.

***

### size?

> `optional` **size**: `string` \| `number`

The size of the color button. Default is "24px".