getColors.js

// Use Clarifai to find the image color scheme
function getColors(file) {
    app.models.predict(Clarifai.COLOR_MODEL, {base64: file}).then(
        // Response handler
        function (response) {
            // Get colors from response and sort by descending prevalence
            const colors = response.outputs[0].data.colors;
            colors.sort((a, b) => (a.value > b.value) ? -1 : ((b.value > a.value) ? 1 : 0));

            const holder = $('#colors');
            holder.html('');

            for (let i = 0; i < colors.length; i++) {
                const color = colors[i];

                // Create new div to hold color information
                const addition = $.parseHTML(
                    '<div><span>'
                    + color.raw_hex + '</span><span>'
                    + color.w3c.name + '</span><span>'
                    + color.value + '</span></div>'
                )[0];

                $(addition).css('background-color', color.raw_hex);
                if (tinycolor(color.raw_hex).isLight()) $(addition).css('color', 'black');

                holder.append(addition);
            }
        },
        // Error handler
        function (err) {
            console.error(err);
        }
    );
}