mirror of
https://github.com/janishutz/color-thief.git
synced 2025-11-25 05:44:24 +00:00
40 lines
890 B
HTML
40 lines
890 B
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
|
<title>Color Thief</title>
|
|
<link rel="stylesheet" href="./screen.css">
|
|
</head>
|
|
<body>
|
|
|
|
<img src="./img/rainbow-horizontal.png" />
|
|
|
|
<div id="result"></div>
|
|
|
|
<script type="module">
|
|
import ColorThief from '../../dist/color-thief.mjs';
|
|
|
|
const colorThief = new ColorThief();
|
|
|
|
|
|
const img = document.querySelector('img');
|
|
|
|
function getColorFromImage(img) {
|
|
const result = colorThief.getColor(img);
|
|
document.querySelector('#result').innerText = result;
|
|
}
|
|
|
|
if (img.complete) {
|
|
getColorFromImage(img);
|
|
} else {
|
|
img.addEventListener('load', function() {
|
|
getColorFromImage(img);
|
|
});
|
|
}
|
|
</script>
|
|
|
|
|
|
</body>
|
|
</html>
|