laiiva-vue-color
vue-color
Modified based on https://github.com/xiaokaike/vue-color to support vue3.0
🎨 Vue Color Pickers for Sketch, Photoshop, Chrome & more
Demo
Example
<Sketch v-model="colors"/>
import { Sketch } from '@ckpack/vue-color';
let colors = {
hex: '#194d33',
hex8: '#194D33A8',
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
};
// or
let colors = '#194d33';
// or
let colors = '#194D33A8';
// or
let colors = { h: 150, s: 0.66, v: 0.30 };
// or
let colors = { r: 255, g: 0, b: 0 };
// etc...
new Vue({
components: {
Sketch,
},
data () {
return {
colors,
};
},
});
License
vue-color is licensed under The MIT License.
Dependencies
clamp: ^1.0.1lodash.throttle: ^4.1.1material-colors: ^1.2.6tinycolor2: ^1.4.2@babel/core: ^7.12.10@babel/preset-env: ^7.12.11@rollup/plugin-alias: ^3.1.1@rollup/plugin-babel: ^5.2.2@rollup/plugin-commonjs: ^17.0.0@rollup/plugin-node-resolve: ^11.0.1@rollup/plugin-replace: ^2.3.4@vue/cli-plugin-babel: ^4.5.10@vue/cli-service: ^4.5.10@vue/compiler-sfc: ^3.0.5cross-env: ^7.0.3minimist: ^1.2.5postcss: ^8.2.3rollup: ^2.36.1rollup-plugin-postcss: ^4.0.0rollup-plugin-terser: ^7.0.2rollup-plugin-vue: ^6.0.0vue: ^3.0.5