Bookmarklet to easy extraction of palettes from Coolors.co

palette_extractor.js

/*
For
 * https://coolors.co

 Using
 * https://babeljs.io/repl/
 * https://chriszarate.github.io/bookmarkleter/
*/

(function() {
  function extractColors() {
    let inputElements = $('.hex input').toArray()
    let colors = inputElements.map(i => i.value)
    return colors
  }

  function theme(colors) {
    let key_values = colors.map((color, i) => `  c${i + 1}: '${color}',`).join("\n")
    return `export const theme = {
${key_values}
}`
  }

  function download(filename, text) {
    let element = document.createElement('a');
    element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text));
    element.setAttribute('download', filename);

    element.style.display = 'none';
    document.body.appendChild(element);

    element.click();

    document.body.removeChild(element);
  }

  function tweakMenu() {
    let exportButtonLabel = $('#export-scss span')
    exportButtonLabel.html('JS')

    let exportButton = $('a#export-scss')
    exportButton.unbind('click')

    exportButton.bind('click', function() {
      download('coolors.js', theme(extractColors()))
    })
  }

  tweakMenu()
}());