Jquery Color Picker

by Sebastian Kay

HTML

<script src="http://vanderlee.github.io/colorpicker/jquery.colorpicker.js"></script>
<link rel="stylesheet" href="http://vanderlee.github.io/colorpicker/jquery.colorpicker.css">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/ui-lightness/jquery-ui.css">
<div class="colorpicker"></div>

CSS

.colorpicker {
    border: solid thin black;
    width: 200px;
    height: 200px;
}

JavaScript

var colorpickerOptions = {
    parts: ['map', 'bar', 'rgb', 'preview', 'swatches', 'footer'],
    altProperties: 'background-color',
    altField: '.colorpicker',
    color: 'fe9810',
    select: function (event, color) {
        var color_in_rgb_format = color.formatted;
        console.log(color_in_hex_format);
    }
    
    ,inline: false
};

$('.colorpicker').colorpicker(colorpickerOptions);