vue-native-color-picker
Lightweight color picker that uses the native HTML element input type color.
Install
npm install vue-native-color-picker
Import
Globally:
import InputColorPicker from "./vue-input-color-picker";
Vue.use(InputColorPicker);
Or locally:
<script setup>
import { ref } from "vue";
import InputColorPicker from "./components/InputColorPicker.vue";
const color = ref("#0f4c81");
const handleInput = (e) => {
console.log("You input", e.target.value);
};
const handleChange = (e) => {
console.log("You picked", e.target.value);
};
</script>
Use
<InputColorPicker v-model="color" />
or if you wish to handle the values externally:
<InputColorPicker v-model="color" @input="handleInput" @change="handleChange" />