Web Color Picker

Because the HTML base one sucks ass

This is a web page showing an example of how exactly this ColorPicker works. Just a simple colored square, and you can pick it's color. The text under it will also change depending on the event fired

Code used in this demo :

HTML :

<script src="https://mizkyosia.github.io/colorPicker.js"></span>

JavaScript :

const colorPicker = new ColorPicker();
colorPicker.onApply = () => {
document.getElementById('text').textContent = 'Color Applied : ' + colorPicker.getCSSColor('HEX');
}

colorPicker.onUpdate = () => {
document.getElementById('text').textContent = 'Color Applied : ' + colorPicker.getCSSColor('HEX');
document.getElementById('exampleCanvas').style.backgroundColor = colorPicker.getCSSColor('HEX');
}

colorPicker.onCancel = () => {
document.getElementById('exampleCanvas').style.backgroundColor = 'black';
document.getElementById('text').textContent = 'Color Cancelled';
}