Paint me a Rainbow

Question

How would you go about making a range of RGB colours evenly spaced over the spectral colour range? So as to look like a real rainbow.

Answer 1

Use HSL instead: fix the brightness and saturation and vary the hue from 0 to 360, then convert to RGB.

HSL describes colors as they are perceived by people. RGB describes them as they are used by machines. So you can't really do anything visually pleasing directly using RGB.

Answer 2

• Red (web colour) (Hex: #FF0000) (RGB: 255, 0, 0)
• Orange (colour wheel Orange) (Hex: #FF7F00) (RGB: 255, 127, 0)
• Yellow (web colour) (Hex: #FFFF00) (RGB: 255, 255, 0)
• Green (X11) (Electric Green) (HTML/CSS “Lime”) (Colour wheel green) (Hex: #00FF00) (RGB: 0, 255, 0)
• Blue (web colour) (Hex: #0000FF) (RGB: 0, 0, 255)
• Indigo (Electric Indigo) (Hex: #6600FF) (RGB: 102, 0, 255)
• Violet (Electric Violet) (Hex: #8B00FF) (RGB: 139, 0, 255)

Between each colour make linear interpolation.

Answer 3

The simplest approach is to do a linear interpolation (in RGB) between each consecutive pair in this sequence:

• #ff0000 red
• #ffff00 yellow
• #00ff00 green
• #00ffff cyan
• #0000ff blue
• #ff00ff magenta
• #ff0000 back to red

This should get you pretty much the same result as sweeping through the hue values in HSV or HSL, but lets you work directly in RGB. Note that only one component changes for each interpolation, which simplifies things. Here's a Python implementation:

def rainbow():
  r, g, b = 255, 0, 0
  for g in range(256):
    yield r, g, b
  for r in range(255, -1, -1):
    yield r, g, b
  for b in range(256):
    yield r, g, b
  for g in range(255, -1, -1):
    yield r, g, b
  for r in range(256):
    yield r, g, b
  for b in range(255, -1, -1):
    yield r, g, b