Go to any color palette on flatuicolors.com (e.g. https://flatuicolors.com/palette/de), then paste & execute the script below in the browser console:
Created
March 11, 2019 21:52
-
-
Save orourkek/2b3bc430c1e98e64e7795309b11fa0ee to your computer and use it in GitHub Desktop.
Grab flatuicolors.com palette as sass variables
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
printSassColors(); | |
function toCamelCase(str) { | |
return str.replace(/(?:^\w|[A-Z]|\b\w)/g, (letter, index) => { | |
return index == 0 ? letter.toLowerCase() : letter.toUpperCase(); | |
}).replace(/\s+/g, ''); | |
} | |
function getColors() { | |
const colors = {}; | |
document.querySelectorAll('.color').forEach((element) => { | |
const name = toCamelCase(element.querySelector('span').innerHTML); | |
const color = element.getAttribute('style') | |
.replace(/^background: /, '') | |
.replace(/;$/, ''); | |
colors[name] = color; | |
}); | |
return colors; | |
} | |
function printSassColors() { | |
const colors = getColors(); | |
console.log( | |
Object.keys(colors).map((name) => { | |
return `\$${name}: ${colors[name]};`; | |
}).join('\n') | |
); | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment