color-picker-field
<color-picker-field> is a themable Web Component providing the possibility to select a color using sliders, inputs or palettes.
<color-picker>
Color picker field is a themable Web Component providing the possibility to select a color using sliders, inputs or palettes.
Example Usage
<color-picker-field></color-picker-field>
Credits
Huge credits also go to the developers of TinyColor that is used for the internal color handling, released under the MIT license.
License
Apache License 2.0
Links
Compatibility
Was this helpful? Need more help?
Leave a comment or a question below. You can also join
the chat on Discord or
ask questions on StackOverflow.
Version
Dependencies
- @polymer/polymer#^3.0.0
- @vaadin/vaadin-control-state-mixin#^2.1.1
- @vaadin/vaadin-element-mixin#^2.0.0
- @vaadin/vaadin-themable-mixin#^1.2.1
- @thebespokepixel/es-tinycolor#^1.0.7
- @appreciated/color-picker#^2.0.0-beta.1
- @polymer/iron-icon#^3.0.1
- @polymer/iron-media-query#^3.0.1
- @vaadin/vaadin-button#^2.2.1
- @vaadin/vaadin-context-menu#^4.3.12
- @vaadin/vaadin-icons#^4.3.1
- @vaadin/vaadin-ordered-layout#^1.1.0
- @vaadin/vaadin-tabs#^3.0.4
- @vaadin/vaadin-text-field#^2.4.11
- Released
- 2019-09-29
- Maturity
- IMPORTED
- License
- Apache License 2.0
Compatibility
- Framework
- Polymer 3.0+
- Polymer 2.0+ in 0.2.2
- Browser
- Browser Independent
color-picker-field - Vaadin Add-on Directory
](https://github.com/juchar/color-picker-field)
## Example Usage
```html
Issue tracker
API Documentation
View on Github
View on GitHub
View on NPM
color-picker-field version 0.1.0
### Dependencies
* polymer#^2.0.0
* vaadin-themable-mixin#vaadin/vaadin-themable-mixin#^1.2.0
* vaadin-element-mixin#vaadin/vaadin-element-mixin#^2.0.0
* vaadin-lumo-styles#vaadin/vaadin-lumo-styles#^1.4.1
* vaadin-material-styles#vaadin/vaadin-material-styles#^1.2.2
* vaadin-text-field#vaadin/vaadin-text-field#^2.4.4
* vaadin-button#vaadin/vaadin-button#^2.2.0
* vaadin-icons#vaadin/vaadin-icons#^4.3.1
* vaadin-tabs#vaadin/vaadin-tabs#^3.0.0
* color-picker#juchar/color-picker#^0.8.1
* vaadin-context-menu#vaadin/vaadin-context-menu#^4.3.11
color-picker-field version 0.2.0
Moved from Chroma.js to TinyColor as Chroma.js could not be deployed to webjars.org due to the SPDX expression used for the license.
### Dependencies
* polymer#^2.0.0
* vaadin-themable-mixin#vaadin/vaadin-themable-mixin#^1.2.0
* vaadin-element-mixin#vaadin/vaadin-element-mixin#^2.0.0
* vaadin-lumo-styles#vaadin/vaadin-lumo-styles#^1.4.1
* vaadin-material-styles#vaadin/vaadin-material-styles#^1.2.2
* vaadin-text-field#vaadin/vaadin-text-field#^2.4.4
* vaadin-button#vaadin/vaadin-button#^2.2.0
* vaadin-icons#vaadin/vaadin-icons#^4.3.1
* vaadin-tabs#vaadin/vaadin-tabs#^3.0.0
* color-picker#juchar/color-picker#^0.9.0
* vaadin-context-menu#vaadin/vaadin-context-menu#^4.3.11
color-picker-field version 0.2.1
### Dependencies
* polymer#^2.0.0
* vaadin-themable-mixin#vaadin/vaadin-themable-mixin#^1.2.0
* vaadin-element-mixin#vaadin/vaadin-element-mixin#^2.0.0
* vaadin-lumo-styles#vaadin/vaadin-lumo-styles#^1.4.1
* vaadin-material-styles#vaadin/vaadin-material-styles#^1.2.2
* vaadin-text-field#vaadin/vaadin-text-field#^2.4.4
* vaadin-button#vaadin/vaadin-button#^2.2.0
* vaadin-icons#vaadin/vaadin-icons#^4.3.1
* vaadin-tabs#vaadin/vaadin-tabs#^3.0.0
* color-picker#juchar/color-picker#^0.9.0
* vaadin-context-menu#vaadin/vaadin-context-menu#^4.3.11
color-picker-field version 0.2.2
### Dependencies
* polymer#^2.0.0
* vaadin-themable-mixin#vaadin/vaadin-themable-mixin#^1.2.0
* vaadin-element-mixin#vaadin/vaadin-element-mixin#^2.0.0
* vaadin-lumo-styles#vaadin/vaadin-lumo-styles#^1.4.1
* vaadin-material-styles#vaadin/vaadin-material-styles#^1.2.2
* vaadin-text-field#vaadin/vaadin-text-field#^2.4.4
* vaadin-button#vaadin/vaadin-button#^2.2.0
* vaadin-icons#vaadin/vaadin-icons#^4.3.1
* vaadin-tabs#vaadin/vaadin-tabs#^3.0.0
* color-picker#juchar/color-picker#^0.9.0
* vaadin-context-menu#vaadin/vaadin-context-menu#^4.3.11
color-picker-field version 2.0.0-alpha.1
### Dependencies
* @appreciated/color-picker#^2.0.0-alpha.2
* @polymer/iron-icon#^3.0.1
* @polymer/iron-media-query#^3.0.1
* @polymer/polymer#^3.3.0
* @vaadin/vaadin-button#^2.2.1
* @vaadin/vaadin-context-menu#^4.3.12
* @vaadin/vaadin-icons#^4.3.1
* @vaadin/vaadin-ordered-layout#^1.1.0
* @vaadin/vaadin-tabs#^3.0.4
* @vaadin/vaadin-text-field#^2.4.11
* @vaadin/vaadin-themable-mixin#^1.4.4
* tinycolor2#^1.4.1
color-picker-field version 2.0.0-alpha.2
### Dependencies
* @polymer/polymer#^3.0.0
* @vaadin/vaadin-control-state-mixin#^2.1.1
* @vaadin/vaadin-element-mixin#^2.0.0
* @vaadin/vaadin-themable-mixin#^1.2.1
* @thebespokepixel/es-tinycolor#^1.0.7
* @appreciated/color-picker#^2.0.0-alpha.2
* @polymer/iron-icon#^3.0.1
* @polymer/iron-media-query#^3.0.1
* @vaadin/vaadin-button#^2.2.1
* @vaadin/vaadin-context-menu#^4.3.12
* @vaadin/vaadin-icons#^4.3.1
* @vaadin/vaadin-ordered-layout#^1.1.0
* @vaadin/vaadin-tabs#^3.0.4
* @vaadin/vaadin-text-field#^2.4.11
color-picker-field version 2.0.0-alpha.3
### Dependencies
* @polymer/polymer#^3.0.0
* @vaadin/vaadin-control-state-mixin#^2.1.1
* @vaadin/vaadin-element-mixin#^2.0.0
* @vaadin/vaadin-themable-mixin#^1.2.1
* @thebespokepixel/es-tinycolor#^1.0.7
* @appreciated/color-picker#^2.0.0-beta.1
* @polymer/iron-icon#^3.0.1
* @polymer/iron-media-query#^3.0.1
* @vaadin/vaadin-button#^2.2.1
* @vaadin/vaadin-context-menu#^4.3.12
* @vaadin/vaadin-icons#^4.3.1
* @vaadin/vaadin-ordered-layout#^1.1.0
* @vaadin/vaadin-tabs#^3.0.4
* @vaadin/vaadin-text-field#^2.4.11
color-picker-field version 2.0.0-alpha.4
### Dependencies
* @polymer/polymer#^3.0.0
* @vaadin/vaadin-control-state-mixin#^2.1.1
* @vaadin/vaadin-element-mixin#^2.0.0
* @vaadin/vaadin-themable-mixin#^1.2.1
* @thebespokepixel/es-tinycolor#^1.0.7
* @appreciated/color-picker#^2.0.0-beta.1
* @polymer/iron-icon#^3.0.1
* @polymer/iron-media-query#^3.0.1
* @vaadin/vaadin-button#^2.2.1
* @vaadin/vaadin-context-menu#^4.3.12
* @vaadin/vaadin-icons#^4.3.1
* @vaadin/vaadin-ordered-layout#^1.1.0
* @vaadin/vaadin-tabs#^3.0.4
* @vaadin/vaadin-text-field#^2.4.11