Examples

1) Attached to a field with hex format specified via options:

<input type="text" class="demo1" value="#5367ce" />
<script>
    $(function(){
        $('.demo1').colorpicker();
    });
</script>
            

As a component:

<div class="input-group demo2">
    <input type="text" value="" class="form-control" />
    <span class="input-group-addon"><i></i></span>
</div>
<script>
    $(function(){
        $('.demo2').colorpicker();
    });
</script>
            

Using events to work with the color:

Change background color

Horizonal mode:

Inline mode:

Enabled / disabled


Enable Disable
Destroy plugin instances Create instances again