How do I lighten or darken a color in Ruby? - abachrome — Practical Ruby Gems

Abachrome’s lighten method adjusts a color’s lightness in a perceptually uniform way. Because it operates in OKLCH space, the hue and chroma stay stable — you don’t get the hue drift or saturation loss that plagues HSL-based adjustments.

Basic Usage

require 'abachrome'

base    = Abachrome.from_hex('#e63946')
lighter = base.lighten(0.15)   # +15% lightness
darker  = base.lighten(-0.15)  # -15% lightness

puts Abachrome::Outputs::CSS.format(lighter.to_srgb)
puts Abachrome::Outputs::CSS.format(darker.to_srgb)

Generating Tint/Shade Scales

base   = Abachrome.from_hex('#0077b6')
shades = (-4..4).map { |step| base.lighten(step * 0.08) }

shades.each_with_index do |color, i|
  hex = Abachrome::Outputs::CSS.format(color.to_srgb)
  puts "shade-#{i * 100}: #{hex}"
end

Adjusting Chroma Directly

For fine-grained control, convert to OKLCH and modify the coordinates directly before converting back:

color = Abachrome.from_hex('#06d6a0').to_oklch
coords = color.coordinates

# Boost chroma by 0.05
more_vivid = Abachrome.from_oklch(
  coords[0],          # keep lightness
  coords[1] + 0.05,  # increase chroma
  coords[2]           # keep hue
)

puts Abachrome::Outputs::CSS.format(more_vivid.to_srgb)

Notes

lighten with a positive value makes the color lighter; negative values darken it.
Passing a value that pushes lightness above 1.0 or below 0.0 may produce out-of-gamut results — use gamut mapping before CSS output if you’re adjusting by large amounts.