@uscreentv/v-color

Simple color picker for vue@2

Usage no npm install needed!

<script type="module">
  import uscreentvVColor from 'https://cdn.skypack.dev/@uscreentv/v-color';
</script>

README

v-color

Simple color picker for vue@2





Install

With npm:

npm install --save @uscreen-video/v-color

Or with yarn:

yarn add @uscreen-video/v-color

Components

VColorPicker

This is the main component, which just represents color picker as is.

Props


value – Color string in hex, rgba or hsla format

type: string

default value: ''


withSuggestions – Enables colors suggestions which stores in local storage. Picker remembers 7 last colors

type: boolean

default value: true

Events


input – Emits on each color change

VColorPopover

It includes VColorPicker, but wrapped into popover component with control button and current color preview. Use it when you need to save visual space.

Props


value – Color string in hex, rgba or hsla format

type: string

default value: ''


withSuggestions – Enables colors suggestions which stores in local storage. Picker remembers 7 last colors

type: boolean

default value: true


position – Popover's position after appearing

type: string

possible values: bottom|left|top|right

default value: bottom

Events


input -> (value: string, suggestion?: boolean) – Emits on each color change or suggestion click