Sleek HTML5 / Javascript Color Picker – iro.js

Category: Color , Javascript | October 3, 2016
Author: jaames
Views Total: 1,838
Official Page: Go to website
Last Update: October 3, 2016
License: MIT


Sleek HTML5 / Javascript Color Picker – iro.js


iro.js is a sleek, HSV color based JavaScript color picker for generating a pretty, HTML5 canvas based color wheel UI with touch support.

How to use it:

Add the core JavaScript library to the html page:

<script src="iro.min.js"></script>

Create a placeholder element for the color picker.

<div class="wheel" id="colorWheelDemo"></div>

Generate a basic color picker inside the container ‘colorWheelDemo’.

var colorWheel = iro.ColorWheel("#colorWheelDemo", {
    // options here

Possible options to customize your color picker.

var colorWheel = iro.ColorWheel("#colorWheelDemo", {
    width: 320,
    height: 320,
    padding: 4,
    sliderMargin: 24
    markerRadius: 8,
    color: "rgb(68, 255, 158)",
    CSS: {} // apply colors to any elements
  • dan sullivan

    This is done well, thank you.

  • pablo79

    Thank you for this script.
    Is it possible to send three RGB values to a POST function for some php script?