<div id="colors">
    <div class="swatch active" style="background-color: black"></div>
    <div class="swatch" style="background-color: grey"></div>
    <div class="swatch" style="background-color: red"></div>
    <div class="swatch" style="background-color: green"></div>
    <div class="swatch" style="background-color: blue"></div>
    <div class="swatch" style="background-color: yellow"></div>
    <div class="swatch" style="background-color: orange"></div>
    <div class="swatch" style="background-color: indigo"></div>
    <div class="swatch" style="background-color: violet"></div>
    <div class="swatch" style="background-color: #FF0080"></div>
</div>

$('#colorSelector').ColorPicker({
    color: '#0000ff',
    onShow: function (colpkr) {
        $(colpkr).fadeIn(500);
        return false;
    },
    onHide: function (colpkr) {
        $(colpkr).fadeOut(500);
        return false;
    },
    onChange: function (hsb, hex, rgb) {
        $('#colorSelector div').css('backgroundColor', '#' + hex);
    }
});