Skip to content

A modern collection of Vue 3 color pickers – fast, accessible, and easy to use. πŸ‘‰ https://linx4200.github.io/vue-color/

License

Notifications You must be signed in to change notification settings

linx4200/vue-color

Repository files navigation

🎨 Vue Color v3.0

NPM version NPM next version Vue 3

GitHub stars size Downloads

A collection of efficient and customizable color pickers built with Vue 3, designed for modern web development.

✨ Features

  • Modular & Tree-Shakable – Only import what you need.

  • TypeScript Ready – Full typings for better DX.

  • Optimized for Accessibility – Built with keyboard navigation and screen readers in mind.

πŸ“¦ Installation

npm install vue-color@next
# or
yarn add vue-color@next

πŸ”§ Usage

Step 1: Import the stylesheet

// main.ts
import { createApp } from 'vue'
import App from './App.vue'

// import stylesheet
import 'vue-color/style.css';

createApp(App).mount('#app')

Step 2: Import the components

<template>
  <ChromePicker v-model="color" />
</template>

<script setup lang="ts">
import { reactive } from 'vue'
import { ChromePicker } from 'vue-color'

const color = defineModel({
  default: '#68CCCA'
});
</script>

πŸ“š Documentation

Coming soon...

🀝 Contributing

Contributions are welcome! Please open issues or pull requests as needed.

πŸ“„ License

MIT