1. vue-sketch-color-picker

vue-sketch-color-picker

vue-sketch-color-picker

Color Picker with Sketch Style.

Installation

NPM

 $ npm install vue-sketch-color-picker
 import colorPicker from 'vue-sketch-color-picker'

new Vue({
  components: {
    colorPicker
  }
})

Build

npm install
npm run build

Usage

 
new Vue({
  el: '#app',
  components: {
    colorPickers
  },
  data: {
    colors: {
      hex: '#194d33',
      hsl: {
        h: 150,
        s: 0.5,
        l: 0.2,
        a: 1
      },
      hsv: {
        h: 150,
        s: 0.66,
        v: 0.30,
        a: 1
      },
      rgba: {
        r: 25,
        g: 77,
        b: 51,
        a: 1
      },
      a: 1
    }
  }
})

 <!-- scheme can be dark or light -->
<color-picker :colors.sync="colors" scheme="dark"></color-picker>

License

vue-sketch-color-picker is licensed under The MIT License.

Dependencies

autoprefixer: ^7.1.0babel-core: ^6.24.1babel-eslint: ^7.2.3babel-helper-vue-jsx-merge-props: ^2.0.2babel-loader: ^7.0.0babel-plugin-istanbul: ^4.1.3babel-plugin-syntax-jsx: ^6.18.0babel-plugin-transform-runtime: ^6.22.0babel-preset-env: ^1.4.0babel-preset-stage-2: ^6.24.1babel-register: ^6.24.1chai: ^3.5.0chalk: ^1.1.3chromedriver: ^2.29.0connect-history-api-fallback: ^1.3.0copy-webpack-plugin: ^4.0.1cross-env: ^5.0.0cross-spawn: ^5.0.1css-loader: ^0.28.1eslint: ^3.19.0eslint-config-standard: ^10.2.1eslint-friendly-formatter: ^3.0.0eslint-loader: ^1.7.1eslint-plugin-html: ^2.0.3eslint-plugin-import: ^2.2.0eslint-plugin-node: ^4.2.2eslint-plugin-promise: ^3.4.0eslint-plugin-standard: ^3.0.1eventsource-polyfill: ^0.9.6express: ^4.14.1extract-text-webpack-plugin: ^2.0.0file-loader: ^0.11.1friendly-errors-webpack-plugin: ^1.1.3function-bind: ^1.1.0html-webpack-plugin: ^2.28.0http-proxy-middleware: ^0.17.3inject-loader: ^3.0.0karma: ^1.7.0karma-coverage: ^1.1.1karma-mocha: ^1.3.0karma-phantomjs-launcher: ^1.0.2karma-sinon-chai: ^1.3.1karma-sourcemap-loader: ^0.3.7karma-spec-reporter: ^0.0.31karma-webpack: ^2.0.3lodash.throttle: ^4.1.1lolex: ^1.5.2mocha: ^3.4.1nightwatch: ^0.9.15node-sass: ^4.5.3opn: ^5.0.0optimize-css-assets-webpack-plugin: ^1.3.1ora: ^1.2.0phantomjs-prebuilt: ^2.1.14rimraf: ^2.6.0sass-loader: ^6.0.5selenium-server: ^3.4.0semver: ^5.3.0sinon: ^2.2.0sinon-chai: ^2.10.0url-loader: ^0.5.7vue-loader: ^12.0.4vue-style-loader: ^3.0.1vue-template-compiler: ^2.3.3webpack: ^2.5.1webpack-bundle-analyzer: ^2.8.1webpack-dev-middleware: ^1.10.2webpack-hot-middleware: ^2.18.0webpack-merge: ^4.1.0