62 lines
1.1 KiB
Plaintext
62 lines
1.1 KiB
Plaintext
---
|
|
group: Widgets
|
|
title: Color
|
|
weight: 12
|
|
---
|
|
|
|
- **Name**: `color`
|
|
- **UI**: Color picker
|
|
- **Data type**: `string`
|
|
|
|
The color widget translates a color picker to a color string.
|
|
|
|
## Widget options
|
|
|
|
For common options, see [Common widget options](/docs/widgets#common-widget-options).
|
|
|
|
| Name | Type | Default | Description |
|
|
| ------------ | ------- | ------- | ---------------------------------------------------------- |
|
|
| default | string | `''` | _Optional_. The default value for the field |
|
|
| allow_input | boolean | `false` | _Optional_. Allows manual editing of the color input value |
|
|
| enable_alpha | boolean | `false` | _Optional_. Enables Alpha editing |
|
|
|
|
## Examples
|
|
|
|
### Basic
|
|
|
|
<CodeTabs>
|
|
```yaml
|
|
name: color
|
|
label: Color
|
|
widget: color
|
|
```
|
|
|
|
```js
|
|
name: 'color',
|
|
label: 'Color',
|
|
widget: 'color',
|
|
```
|
|
|
|
</CodeTabs>
|
|
|
|
### Kitchen Sink
|
|
|
|
<CodeTabs>
|
|
```yaml
|
|
name: color
|
|
label: Color
|
|
widget: color
|
|
enable_alpha: true
|
|
allow_input: true
|
|
```
|
|
|
|
```js
|
|
name: 'color',
|
|
label: 'Color',
|
|
widget: 'color',
|
|
enable_alpha: true,
|
|
allow_input: true,
|
|
```
|
|
|
|
</CodeTabs>
|