https://github.com/ckpack/vue-color
(vue3.0) 🎨 Vue Color Pickers UI Library for Sketch, Photoshop, Chrome & more
https://github.com/ckpack/vue-color
color-picker vue-color
Last synced: 6 months ago
JSON representation
(vue3.0) 🎨 Vue Color Pickers UI Library for Sketch, Photoshop, Chrome & more
- Host: GitHub
- URL: https://github.com/ckpack/vue-color
- Owner: ckpack
- License: mit
- Created: 2021-04-16T06:34:33.000Z (over 4 years ago)
- Default Branch: main
- Last Pushed: 2024-07-19T02:18:39.000Z (about 1 year ago)
- Last Synced: 2025-03-28T09:09:18.602Z (7 months ago)
- Topics: color-picker, vue-color
- Language: Vue
- Homepage: https://ckpack.github.io/vue-color/
- Size: 2.53 MB
- Stars: 184
- Watchers: 1
- Forks: 12
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# vue-color
> Modified based on [https://github.com/xiaokaike/vue-color](https://github.com/xiaokaike/vue-color) to support vue3.0
🎨 Vue Color Pickers for Sketch, Photoshop, Chrome & more
## [Demo](https://ckpack.github.io/vue-color)
## Use case
#### On demand
We can import components we actually need, making the project smaller than otherwise.
##### Import Directly
```html
import { ref } from 'vue';
import { Sketch } from '@ckpack/vue-color';
const colors = ref('#194D33A8'); // etc: { h: 150, s: 0.66, v: 0.30 }, { r: 255, g: 0, b: 0 }, '#194d33'
```
##### Install on Demand Globally
```js
import { createApp } from 'vue';
import App from '@/App.vue';
import { Sketch, create } from '@ckpack/vue-color';
const app = createApp(App);
app.use(create({
components: [Sketch],
}));
app.mount('#app');
```
#### Fully import
```js
import { createApp } from 'vue';
import App from '@/App.vue';
import VueColor from '@ckpack/vue-color';
const app = createApp(App);
app.use(VueColor);
app.mount('#app');
```
## [CHANGELOG](/CHANGELOG.md)
## License
vue-color is licensed under [The MIT License](LICENSE).