Name: paper-swatch-picker
Owner: PolymerElements
Description: A color picker with all the Material Design colours
Created: 2016-01-11 19:06:34.0
Updated: 2018-05-09 17:23:47.0
Pushed: 2018-05-23 02:38:46.0
Homepage: null
Size: 85
Language: HTML
GitHub Committers
| User | Most Recent Commit | # Commits |
|---|
Other Committers
| User | Most Recent Commit | # Commits |
|---|
This is a simple color picker element that will allow you to choose one of the Material Design colors from a list of available swatches.
Example:
er-swatch-picker></paper-swatch-picker>
er-swatch-picker color="{{selectedColor}}"></paper-swatch-picker>
You can configure the color palette being used using the colorList array and
the columnCount property, which specifies how many “generic” colours (i.e. columns
in the picker) you want to display.
er-swatch-picker column-count=5 color-list='["#65a5f2", "#83be54", "#f0d551", "#e5943c", "#a96ddb"]'></paper-swatch-picker>
The following custom properties and mixins are available for styling:
| Custom property | Description | Default |
| — | — | — |
| --paper-swatch-picker-color-size | The size of each of the color boxes | 20px |
| --paper-swatch-picker-icon-size | The size of the color picker icon | 24px |
| --paper-swatch-picker-icon | Mixin applied to the color picker icon | {} |