Skip to content

Instantly share code, notes, and snippets.

@XavierGeerinck
Created March 30, 2022 11:32
Show Gist options
  • Save XavierGeerinck/d1e8248c47228c9ed3998454947e5128 to your computer and use it in GitHub Desktop.
Save XavierGeerinck/d1e8248c47228c9ed3998454947e5128 to your computer and use it in GitHub Desktop.
color-to-figma.js
const json = require("./color.json");
let res = {};
// Parse Grays
let idx = 0;
for (const shade of json.grays) {
let colorLabel = shade.label.split("-")[0];
const colorLevel = idx == 0 ? 50 : 100 * idx
idx++;
if (!res[colorLabel]) {
res[colorLabel] = {};
}
if (!res[colorLabel][colorLevel]) {
res[colorLabel][colorLevel] = {
value: shade.hex,
type: "color"
}
}
}
// Parse Colors
for (const color of json.colors) {
let idx = 0;
for (const shade of color.colors) {
let colorLabel = shade.label.split("-")[0];
const colorLevel = idx == 0 ? 50 : 100 * idx
idx++;
if (!res[colorLabel]) {
res[colorLabel] = {};
}
if (!res[colorLabel][colorLevel]) {
res[colorLabel][colorLevel] = {
value: shade.hex,
type: "color"
}
}
}
}
console.log(JSON.stringify(res, null, 4));
// 50 light
// 100 light:hover
// 200 light:active
// 300 normal
// 400 normal:hover
// 500 normal:active
// 600 dark
// 700 dark:hover
// 800 dark:active
// 900 darker
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment