Common color keys

[boar-is]

Not:

export const gray = {
  gray1: "#fcfcfc",
  gray2: "#f9f9f9",
  gray3: "#f0f0f0",
  // etc.
};

But:

export const gray = {
  1: "#fcfcfc",
  2: "#f9f9f9",
  3: "#f0f0f0",
  // etc.
};

This gives the ability to swap colors dynamically:

function createTheme(palette: Palette) {
  return {
    background: palette[1],
    foreground: palette[12],
    // etc.
  }
}

const blueTheme = createTheme(colors.blue)
const redTheme = createTheme(colors.red)

For example, Tailwind does the same.