Vue Swatches是Vue的颜色选择器UI组件，允许用户选择颜色。与所有颜色都可用（167 77 216种颜色）的经典拾色器不同，Vue色板仅显示一堆预定义的颜色。

安装和下载：

# Yarn
$ yarn add vue-swatches

# NPM
$ npm install vue-swatches --save

变更日志：

v2.1.0（09/09/2020）

• 现在，内联模式是无填充的，包装器具有内容框
• 如果只有三个或更少的色板，则包装宽度自动调整

基本用法

<!-- Vue component -->
<template>
  <div>
    <v-swatches v-model="color"></v-swatches>
  </div>
</template>

<script>
  import VSwatches from 'vue-swatches'

  // 在全局范围内也导入样式
  import "vue-swatches/dist/vue-swatches.css"

  export default {
    components: { VSwatches }, // window['vue-swatches'] - from CDN
    data () {
      return {
        color: '#1CA085'
      }
    }
  }
</script>