Playing with colors

colorChanges.js

import tinycolor from 'tinycolor2';

export const darken = (color, degree = 10) => {
  if (0 <= degree && degree <= 100) {
    return tinycolor(color)
      .darken(degree)
      .toString();
  } else {
    throw new RangeError('The color darken degree must be between 0 and 100.');
  }
};

import { toPairs } from 'ramda';
import { colors } from './palette';

const step = 10;

for (const [key, color] of toPairs(colors)) {
  const sheet = [
    `${key} -- ` + color,
    `${key} dark ` + darken(color, step),
    `${key} darkest ` + darken(color, step * 2)
  ];

  console.log(sheet);
}

palette.js

export const colors = {
  primary: '#008859',
  secondary: '#554854',
  accent: '#FF6600',
  widget: '#4690D1',
  alarm: '#CF4444'
};

export const { primary, secondary, accent, widget, alarm } = colors;