smoother-landscape-colors.js

function landscapeColors(percentage) {
  const colorVariety = 3;
  const colorStep = 360 / colorVariety;
  const colorIndex = Math.floor(percentage * colorVariety);
  const hue =
    colorStep * colorIndex + colorStep * (percentage - (colorIndex * 100) / 3);
  const lightness = percentage < 0.01 ? 100 : 50;
  const saturation = 100;

  return `hsl(${hue < 360 ? hue : hue - 360}, ${saturation}%, ${lightness}%)`;
}