Skip to content

Instantly share code, notes, and snippets.

@roNn23
Created August 4, 2019 19:51
Show Gist options
  • Save roNn23/e55fd05a2f521c9547bcef4ef3f54458 to your computer and use it in GitHub Desktop.
Save roNn23/e55fd05a2f521c9547bcef4ef3f54458 to your computer and use it in GitHub Desktop.
Prints all colors from a coloors.co scheme in the console to copy the values more easily
let allColorData = [];
document.querySelectorAll('#colors .color').forEach(colorNode => {
const colorData = {
name: colorNode.querySelector('.color-info-name').textContent,
hex: colorNode.querySelector('.hex input').value,
shades: []
}
allColorData.push(colorData);
})
document.querySelectorAll('.palette-shades-row').forEach(row => {
const colorNodes = row.querySelectorAll('.palette-shades-col');
colorNodes.forEach((colorNode, colorColIndex) => {
const colorHex = colorNode.getAttribute('data-color').trim();
allColorData[colorColIndex].shades.push(colorHex);
//console.log(`%c ${colorHex}`, `background: #fff; color: #${colorHex}`);
})
})
allColorData.forEach(colorData => {
console.log(`%c ${colorData.name} ${colorData.hex}`, `background: #000; color: #fff`);
colorData.shades.forEach(color => {
console.log(`%c ${color}`, `border-left: 10px solid #${color}; background: #fff; color: #${color}`);
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment