Test Page

NOTE: jQuery is required

Insert a Script Editor Web Part onto a page. Insert the following code:

<p>jPicker Test Page</p>

<script type="text/javascript">
  $(document).ready(
    function()
    {
      $('#jPickerColorBox').jPicker(
        {
          window:
          {
            position:
            {
              x: 'screenCenter',
              y: 'center',
            },
            expandable: true,
          },
          images:
          {
            clientPath: '/_layouts/15/jPicker/1.1.6/images/'
          }
        });
    });
</script>
<input id="jPickerColorBox" type="text" value="e2ddcf" />

The page will display and input box with a hex color and a color selector box.

Some things to note:

1. If the position is not centered the picker may go off the screen
2. The clientPath MUST be set to /_layouts/15/jPicker/1.1.6/images/