# @wh-chen/color-picker

> 基于vue3实现的通用颜色选择器

Latest version **0.0.2** (published 2023-04-08) · 0 weekly downloads

## Install

```sh
npm install @wh-chen/color-picker
pnpm add @wh-chen/color-picker
yarn add @wh-chen/color-picker
bun add @wh-chen/color-picker
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types; low quality score; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.2 |
| Published | 2023-04-08 |
| First published | 2023-04-08 |
| Weekly downloads | 0 |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 3 |
| Unpacked size | 95.8 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 2 |
| Author | chenweihuan |
| Maintainers | chenweihuan |
| Keywords | color-picker, @wh-chen/color-picker, vue3-color-picker, vue-color-picker |

## Links

- npm: https://www.npmjs.com/package/@wh-chen/color-picker
- Repository: https://github.com/chenweihuan/color-picker
- Homepage: https://github.com/chenweihuan/color-picker#readme
- Issues: https://github.com/chenweihuan/color-picker/issues
- npm.io page: https://npm.io/package/@wh-chen/color-picker

## Dependencies (3)

- [vue](https://npm.io/package/vue.md) ^3.2.47
- [lodash-es](https://npm.io/package/lodash-es.md) ^4.17.21
- [tinycolor2](https://npm.io/package/tinycolor2.md) ^1.6.0

## Alternatives

- [postcss-color-hex-alpha](https://npm.io/package/postcss-color-hex-alpha.md) — 6.4M weekly downloads
- [randomcolor](https://npm.io/package/randomcolor.md) — 348.0K weekly downloads
- [bows](https://npm.io/package/bows.md) — 1.3K weekly downloads
- [ep_prefer_color_scheme](https://npm.io/package/ep_prefer_color_scheme.md) — 260 weekly downloads
- [coc-yank](https://npm.io/package/coc-yank.md) — 61 weekly downloads

## Recent versions

- 0.0.2 (latest) — 2023-04-08
- 0.0.2-beta.6 — 2023-04-08
- 0.0.2-beta.5 — 2023-04-08
- 0.0.2-beta.4 — 2023-04-08
- 0.0.2-beta.3 — 2023-04-08
- 0.0.2-beta.2 — 2023-04-08
- 0.0.2-beta.1 — 2023-04-08
- 0.0.1 — 2023-04-08

## README

# ColorPicker

> 使用vue3写的一个通用颜色选择器

目前实现了一个类chrome颜色选择器，下一步将写一个类figma颜色选择器。大致效果图👇：  

<img src="https://static.yximgs.com/udata/pkg/fe/color-picker.png" width="300" />

## 怎么使用?
1. 安装
```shell
npm install @wh-chen/color-picker
```
or
```shell
yarn add @wh-chen/color-picker
```

2. 全局使用
```js
import { createApp } from 'vue'
import App from './App.vue'
const app = createApp(App);

import colorPicker from '@wh-chen/color-picker';
app.use(colorPicker);

app.mount('#app');
```

3. 按需使用
```html
<script setup>
import { ref } from 'vue';
import { ChromeColorPicker } from '@wh-chen/color-picker';

const color = ref('#ffffff');
</script>
<template>
    <div>
        <ChromeColorPicker v-model="color"/>
    </div>
</template>
```

---
_Source: https://npm.io/package/@wh-chen/color-picker · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._