How can I add an external Color picker to my form?

Using the JSColor color picker

JSColor is a lightweight picker that does not require jQuery (or MooTools) and is very simple to use.

Download the latest release of JSColor here where you can also see a demo and documents.

Unzip the file and copy the jscolor folder to the components/com_chronoforms5/extras/ folder on your site. If this doesn't exist you may need to create it.

In your form Designer tab add a Text Box element and, in the settings, add jscolor to the Class box. (Note: some earlier versions used color as the class.) 

In the Setup tab drag a Load JavaScript action into the On load event (or the event that loads the page including the color picker if this is a multi-page form). In the JS Files box of the Load JavaScript action add this code to load the library:

<?php
echo JUri::root().'components/com_chronoforms5/extras/jscolor/jscolor.js';
?>

Save your form and test and voila ! it should be working.