---
name: "hsv2rgb"
mode: "api"
versionRequirements:
  - { name: "@ray-js/panel-sdk", version: "1.0.0" }
title: "color"
---

## hsv2rgb

> [VERSION] @ray-js/panel-sdk >= 1.0.0

### Description

Convert HSV to the RGB color model

### Parameters

`Params`

| Parameter | Type | Required | Description |
| --- | --- | --- | --- |
| `h` | `number` | Yes | Hue (0-360) |
| `s` | `number` | Yes | Saturation (0-100) |
| `v` | `number` | Yes | Value (0-100) |
| `a` | `number` | No | Optional alpha (0-1) |

### Return Value

Type: `number[]`

RGB array [r, g, b], each channel in 0-255

### Examples

#### Basic usage

```ts
import { utils } from '@ray-js/panel-sdk';

const { hsv2rgb } = utils;

hsv2rgb(0, 100, 100);   // [255, 0, 0]  Red
hsv2rgb(120, 100, 100);  // [0, 255, 0]  Green
hsv2rgb(240, 100, 100);  // [0, 0, 255]  Blue
```

---
name: "rgb2hsv"
mode: "api"
versionRequirements:
  - { name: "@ray-js/panel-sdk", version: "1.0.0" }
title: "color"
---
## rgb2hsv

> [VERSION] @ray-js/panel-sdk >= 1.0.0

### Description

Convert RGB to the HSV color model

### Parameters

`Params`

| Parameter | Type | Required | Description |
| --- | --- | --- | --- |
| `r` | `number` | Yes | Red channel (0-255) |
| `g` | `number` | Yes | Green channel (0-255) |
| `b` | `number` | Yes | Blue channel (0-255) |

### Return Value

Type: `number[]`

HSV array [h, s, v], where h is hue (0-360), s is saturation (0-100), v is value (0-100)

### Examples

#### Basic usage

```ts
import { utils } from '@ray-js/panel-sdk';

const { rgb2hsv } = utils;

rgb2hsv(255, 0, 0);   // [0, 100, 100]  Red
rgb2hsv(0, 255, 0);   // [120, 100, 100] Green
rgb2hsv(128, 128, 128); // [0, 0, 50]    Gray
```

---
name: "hex2hsv"
mode: "api"
versionRequirements:
  - { name: "@ray-js/panel-sdk", version: "1.0.0" }
title: "color"
---
## hex2hsv

> [VERSION] @ray-js/panel-sdk >= 1.0.0

### Description

Convert a hex color to the HSV model

### Parameters

`Params`

| Parameter | Type | Required | Description |
| --- | --- | --- | --- |
| `hex` | `string` | Yes | Hex color string, e.g., '#FF0000' or 'FF0000' |

### Return Value

Type: `number[]`

HSV array [h, s, v], where h is hue (0-360), s is saturation (0-100), v is value (0-100)

### Examples

#### Basic usage

```ts
import { utils } from '@ray-js/panel-sdk';

const { hex2hsv } = utils;

hex2hsv('#FF0000'); // [0, 100, 100]
hex2hsv('#00FF00'); // [120, 100, 100]
```

---
name: "hex2rgbString"
mode: "api"
versionRequirements:
  - { name: "@ray-js/panel-sdk", version: "1.0.0" }
title: "color"
---
## hex2rgbString

> [VERSION] @ray-js/panel-sdk >= 1.0.0

### Description

Convert a hex color to a CSS RGB/RGBA string

### Parameters

`Params`

| Parameter | Type | Required | Description |
| --- | --- | --- | --- |
| `hex` | `string` | Yes | Hex color string, e.g., '#FF0000' or 'FF0000' |
| `a` | `number` | No | Optional alpha (0-1) |

### Return Value

None


### Examples

#### Basic usage

```ts
import { utils } from '@ray-js/panel-sdk';

const { hex2rgbString } = utils;

hex2rgbString('#FF0000');       // 'rgb(255, 0, 0)'
hex2rgbString('#FF0000', 0.5); // 'rgba(255, 0, 0, 0.5)'
```

---
name: "hsv2rgbString"
mode: "api"
versionRequirements:
  - { name: "@ray-js/panel-sdk", version: "1.0.0" }
title: "color"
---
## hsv2rgbString

> [VERSION] @ray-js/panel-sdk >= 1.0.0

### Description

Convert HSV to a CSS RGB/RGBA string

### Parameters

`Params`

| Parameter | Type | Required | Description |
| --- | --- | --- | --- |
| `h` | `number` | Yes | Hue (0-360) |
| `s` | `number` | Yes | Saturation (0-100) |
| `v` | `number` | Yes | Value (0-100) |
| `a` | `number` | No | Optional alpha (0-1) |

### Return Value

None


### Examples

#### Basic usage

```ts
import { utils } from '@ray-js/panel-sdk';

const { hsv2rgbString } = utils;

hsv2rgbString(0, 100, 100);      // 'rgb(255, 0, 0)'
hsv2rgbString(120, 100, 100, 0.8); // 'rgba(0, 255, 0, 0.8)'
```

---
name: "brightKelvin2rgb"
mode: "api"
versionRequirements:
  - { name: "@ray-js/panel-sdk", version: "1.0.0" }
title: "color"
---
## brightKelvin2rgb

> [VERSION] @ray-js/panel-sdk >= 1.0.0

> 💡 Commonly used on lighting device panels to convert device-reported brightness and color temperature DP values into a displayable color.

### Description

Convert brightness and color temperature values to an RGB color string

### Parameters

`Params`

| Parameter | Type | Required | Description |
| --- | --- | --- | --- |
| `bright` | `any` | No | Brightness value, range 1–1000 |
| `temperature` | `any` | No | Color temperature value, range 0–1000 |
| `kelvinRange` | `KelvinRange` | No | Optional color temperature range config; kelvinMin defaults to 2200, kelvinMax defaults to 6500 |

### Return Value

None


### Referenced Types

##### `type` KelvinRange

Color temperature range configuration for brightKelvin2rgb

| Property | Type | Description |
| --- | --- | --- |
| `kelvinMin` | `number` | Minimum color temperature (Kelvin), default 2200 |
| `kelvinMax` | `number` | Maximum color temperature (Kelvin), default 6500 |


### Examples

#### Basic usage

```ts
import { utils } from '@ray-js/panel-sdk';

const { brightKelvin2rgb } = utils;

const color = brightKelvin2rgb(1000, 1000); // max brightness, max color temperature
const warm = brightKelvin2rgb(500, 0);      // medium brightness, minimum color temperature (warm light)
const custom = brightKelvin2rgb(800, 500, { kelvinMin: 2700, kelvinMax: 6500 });
```

---
name: "rgb2RgbString"
mode: "api"
versionRequirements:
  - { name: "@ray-js/panel-sdk", version: "1.0.0" }
title: "color"
---
## rgb2RgbString

> [VERSION] @ray-js/panel-sdk >= 1.0.0

> 💡 Uses rgba automatically when a 4-element array is passed; when a 3-element array is passed and the a parameter is provided, rgba is also used.

### Description

Convert an RGB numeric array to a CSS color string

### Parameters

`Params`

| Parameter | Type | Required | Description |
| --- | --- | --- | --- |
| `originRgb` | `number[]` | Yes | RGB or RGBA numeric array, e.g., [255, 0, 0] or [255, 0, 0, 0.5] |
| `a` | `number` | No | Optional alpha transparency value (0–1), effective when the array has 3 elements |

### Return Value

None


### Examples

#### Basic usage

```ts
import { utils } from '@ray-js/panel-sdk';

const { rgb2RgbString } = utils;

rgb2RgbString([255, 0, 0]);       // 'rgb(255, 0, 0)'
rgb2RgbString([255, 0, 0], 0.5);  // 'rgba(255, 0, 0, 0.5)'
rgb2RgbString([255, 0, 0, 0.8]);  // 'rgba(255, 0, 0, 0.8)'
```

---
name: "kelvin2rgb"
mode: "api"
versionRequirements:
  - { name: "@ray-js/panel-sdk", version: "1.0.0" }
title: "color"
---
## kelvin2rgb

> [VERSION] @ray-js/panel-sdk >= 1.0.0

> 💡 Curve fitting based on black-body radiation, suitable for non-precision-critical scenarios such as photo processing. Accuracy is best between 1000K and 40000K.

### Description

Convert a Kelvin color temperature to an RGB array

### Parameters

`Params`

| Parameter | Type | Required | Description |
| --- | --- | --- | --- |
| `kelvin` | `number` | Yes | Kelvin color temperature (recommended range 1000K - 40000K) |

### Return Value

Type: `number[]`

RGB array [r, g, b], each channel in 0-255

### Examples

#### Basic usage

```ts
import { utils } from '@ray-js/panel-sdk';

const { kelvin2rgb } = utils;

const rgb = kelvin2rgb(6500); // Daylight color temperature, close to [255, 249.574170569891, 254.30625501058964]
const warm = kelvin2rgb(2700); // Warm white color temperature
```

---
name: "rgb2kelvin"
mode: "api"
versionRequirements:
  - { name: "@ray-js/panel-sdk", version: "1.0.0" }
title: "color"
---
## rgb2kelvin

> [VERSION] @ray-js/panel-sdk >= 1.0.0

> 💡 Map an RGB color back to an approximate Kelvin temperature via binary search.

### Description

Convert RGB to a Kelvin color temperature

### Parameters

`Params`

| Parameter | Type | Required | Description |
| --- | --- | --- | --- |
| `rgb` | `number[]` | Yes | RGB array [r, g, b] |

### Return Value

None


### Examples

#### Basic usage

```ts
import { utils } from '@ray-js/panel-sdk';

const { rgb2kelvin } = utils;

const kelvin = rgb2kelvin([255, 255, 255]); // approximately 6524
```

---
name: "rgb2hsb"
mode: "api"
versionRequirements:
  - { name: "@ray-js/panel-sdk", version: "1.0.0" }
title: "color"
---
## rgb2hsb

> [VERSION] @ray-js/panel-sdk >= 1.0.0

> 💡 HSB and HSV are different names for the same color model; they are functionally identical.

### Description

Convert RGB to the HSB color model

### Parameters

`Params`

| Parameter | Type | Required | Description |
| --- | --- | --- | --- |
| `r` | `number` | Yes | Red channel (0-255) |
| `g` | `number` | Yes | Green channel (0-255) |
| `b` | `number` | Yes | Blue channel (0-255) |

### Return Value

Type: `number[]`

HSB array [h, s, b], equivalent to the HSV model

### Examples

#### Basic usage

```ts
import { utils } from '@ray-js/panel-sdk';

const { rgb2hsb } = utils;

rgb2hsb(255, 0, 0); // [0, 100, 100]
```

---
name: "rgb2hex"
mode: "api"
versionRequirements:
  - { name: "@ray-js/panel-sdk", version: "1.0.0" }
title: "color"
---
## rgb2hex

> [VERSION] @ray-js/panel-sdk >= 1.0.0

### Description

Convert RGB to a hex color string

### Parameters

`Params`

| Parameter | Type | Required | Description |
| --- | --- | --- | --- |
| `r` | `number` | Yes | Red channel (0-255) |
| `g` | `number` | Yes | Green channel (0-255) |
| `b` | `number` | Yes | Blue channel (0-255) |

### Return Value

None


### Examples

#### Basic usage

```ts
import { utils } from '@ray-js/panel-sdk';

const { rgb2hex } = utils;

rgb2hex(255, 0, 0); // '#FF0000'
rgb2hex(0, 255, 0); // '#00FF00'
```