Given a hex color, finds the optimal font color (black or white)

getcolor.js

function getFontColorFromBackgroundColor (bgColor) {
  if (!bgColor.match(/#[0-9a-z]{6}/i)) {
    return 'white';
  }

  const [r, g, b] = [1, 3, 5].map((o) => parseInt(bgColor.slice(o, o + 2), 16));
  const greyscale = (0.2125 * r) + (0.7154 * g) + (0.0721 * b);
  return (greyscale > 127) ? 'black' : 'white';
}

JavaScript function that takes any background color and produces the most readable, legible font color.

Inspired by Mark Ransom's answer on StackOverflow.

For maximum legibility, you want maximum brightness contrast without getting into hues which don't work together. The most consistent way to do this is to stick with black or white for the text color. You might be able to come up with more aesthetically pleasing schemes, but none of them will be more legible.