无外部依赖时如何在两个数值（RGB值）间实现tween/Lerp插值

完全可以通过原生基础语法实现，不需要引入任何外部库，也不需要依赖外置工具函数，核心逻辑就是线性插值的通用算术公式。

线性插值核心公式：插值结果 = 起始值 + (终点值 - 起始值) * 插值参数t
其中插值参数t的取值范围为[0,1]，和你提到的滑块交互逻辑完全对应：t=0时返回起始颜色，t=1时返回终点颜色。

针对你需要的纯红到纯绿的插值场景：

• 起始状态（t=0）RGB值：(255, 0, 0)
• 终点状态（t=1）RGB值：(0, 255, 0)
  由于两个端点的B通道值均为0，插值全程B通道固定为0，只需要对R、G通道分别套用插值公式计算即可。

核心实现代码（逻辑可直接平移到任意编程语言）：

// t 为滑块传入的插值参数，取值范围0~1
const getInterpolateColor = (t) => {
  // 先钳制t的范围到0-1区间，避免滑块越界时出现非法颜色值
  t = t < 0 ? 0 : t > 1 ? 1 : t
  // 三个通道分别计算插值结果
  const r = 255 + (0 - 255) * t
  const g = 0 + (255 - 0) * t
  const b = 0
  // 若需要0-255区间的整数色值，可通过原生位运算取整，无需调用内置对象方法
  return `rgb(${r | 0}, ${g | 0}, ${b})`
}

补充说明：

• 上述实现所有计算均为基础算术、逻辑运算，没有任何外部依赖。
• 如果需要扩展到任意两个RGB颜色的插值，只需要把公式里的起止通道值替换为目标颜色的对应R/G/B值，三个通道分别计算即可，逻辑完全通用。
• 如果追求更符合人眼感知的顺滑颜色过渡，可以在这个基础上增加伽马校正环节，基础滑块交互场景下直接用线性插值就能满足需求。

内容的提问来源于stack exchange，提问作者creepersaur