const $colorPicker = document.getElementById('color-picker'); $colorPicker.color = '#367E95'; console.log($colorPicker.hex); // #367E95 console.log($colorPicker.hex8); // #367E95FF console.log($colorPicker.rgb); // rgb(54, 126, 149) console.log($colorPicker.rgba); // rgba(54, 126, 149, 1) console.log($colorPicker.hsl); // hsl(195, 47%, 40%) console.log($colorPicker.hsla); // hsla(195, 47%, 40%, 1) console.log($colorPicker.hsv); // hsv(195, 64%, 58%) console.log($colorPicker.hsva); // hsva(195, 64%, 58%, 1)
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter