JSFiddle - React, Tailwind, and code Playground

by cleaver

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/color-thief/2.3.0/color-thief.umd.js"></script>
<img src="https://cdn4.buysellads.net/uu/1/41629/1547651789-slack-carbon-white_2x.png" alt="Smiley face" width="42" height="42">

JavaScript

const colorThief = new ColorThief();
const img = document.querySelector('img');
img.crossOrigin = "Anonymous";

var url = 'http://lorempixel.com/g/400/200/';
var imgObj = new Image();
imgObj.src = url + '?' + new Date().getTime();
imgObj.setAttribute('crossOrigin', '');

// Make sure image is finished loading
if (imgObj.complete) {
  colorThief.getColor(url);
} else {
  image.addEventListener('load', function() {
    colorThief.getColor(url);
  });
}

console.log(colorThief)