Tampermonkey script to copy colors from SchemeColor.com

index.js

// ==UserScript==
// @name         SchemeColor.com Copy Button
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  copy color palette from SchemeColor
// @author       Andrew McOlash
// @match        https://www.schemecolor.com/*
// @icon         https://www.google.com/s2/favicons?domain=schemecolor.com
// @grant        GM_setClipboard
// ==/UserScript==

(function() {
    'use strict';

    // Code adapted from https://css-tricks.com/converting-color-spaces-in-javascript/
    function RGBToHex(r,g,b) {
        r = Number.parseInt(r).toString(16);
        g = Number.parseInt(g).toString(16);
        b = Number.parseInt(b).toString(16);

        if (r.length == 1) r = "0" + r;
        if (g.length == 1) g = "0" + g;
        if (b.length == 1) b = "0" + b;

        return "#" + r + g + b;
    }

    const colors = Array.from(document.querySelectorAll('#list .mc-block div')).map(el => {
        const rgbString = el.style.background;
        const rgb = rgbString.replace('rgb(', '').replace(')', '').split(',');
        const hex = RGBToHex(...rgb);

        return hex;
    });

    const button = document.createElement('div');
    button.className = "downloadbtn";
    button.style.cursor = 'pointer';
    button.onclick = () => GM_setClipboard(JSON.stringify(colors), 'text');

    const icon = document.createElement('img');
    // Icon made by Kiranshastry https://www.flaticon.com/
    icon.src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAAzAAAAMwB6wBQKQAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAGLSURBVEiJ1dQ9axRRFMbx35GAYAQLCaTQIo0YxVIIViIWiljELyBBsLCLlZ34BSwsLCy00SqQziq+dGlCqkAS01gIgRCbQAJ2x2LvwgR2du9sAuIDB+7LOc9/7pmZKzPVBBaxUWKxuq7SfB4rmC6xgvlTAWAOu7iMx3hSxruYG1U/oaGICNzCVFm6iUdYyMxfEfEVUcYL+BARy1gr+ftYzfJkSnIT8A1H+I2rCNzNzEMDFBHn8QWJH7iIycy808+ZaCTPFuDDMn+F/TZzyMzDiPiIqcx8Weq+R8RsZm4dA+ACDhrzs7gfEZfaAEU39L6svg6K1/ETDNAStkeYKzkbbZutgMxcx3oFYKjOnNRglFpPEBHP8bTS511mvu4EwFu8rwT8adv4dy3CMx1ahG4tKj0dWNRFw17yNVyp9NnJzM1OAFzHg0rAZ3QDZOaS3t98Ig1r0T3cHgB+cSoAvbu95i4aD/Df3EVNwE/MRMS5cc1K7UzxQqNFmbkXEZ+wExGTYzKO8CYz9/oLfwGLMxyCUAggIAAAAABJRU5ErkJggg==";
    icon.style.width = '13px';
    icon.style.height = '13px';
    icon.style.marginRight = '4px';

    const text = document.createElement('span');
    text.innerText = 'Copy';

    button.appendChild(icon);
    button.appendChild(text);

    const buttons = document.querySelector('.bar-buttons');
    buttons.style.gridTemplateColumns = '1fr 1fr 1fr';
    buttons.appendChild(button);

    console.log(colors);
})();