ColorPicker
ColorPicker is a color selector supporting multiple color formats.
TIP
This component requires the <client-only></client-only> wrap when used in SSR (eg: Nuxt) and SSG (eg: VitePress).
Basic usage
Alpha
Predefined colors
Sizes
API
Attributes
| Name | Description | Type | Default |
|---|---|---|---|
| model-value / v-model | binding value | string | — |
| disabled | whether to disable the ColorPicker | boolean | false |
| size | size of ColorPicker | enum | — |
| show-alpha | whether to display the alpha slider | boolean | false |
| color-format | color format of v-model | enum | — |
| popper-class | custom class name for ColorPicker's dropdown | string | — |
| predefine | predefined color options | object | — |
| validate-event | whether to trigger form validation | boolean | true |
| tabindex | ColorPicker tabindex | string / number | 0 |
| labela11y | ColorPicker aria-label | string | — |
| id | ColorPicker id | string | — |
Events
| Name | Description | Type |
|---|---|---|
| change | triggers when input value changes | Function |
| active-change | triggers when the current active color changes | Function |
Exposes
| Name | Description | Type |
|---|---|---|
| color | current color object | object |
三咲智子
云游君
Jeremy
kooriookami
Xc
zz
LIUCHAO
Alan Wang
btea
Delyan Haralanov
C.Y.Kun
weidehai
Hefty
opengraphica
bqy
Aex
内小子
on the field of hope
zazzaz
Hades-li
LooSheng
qiang
iamkun