在Javascript中将不透明度转换为十六进制

Question

在Javascript中将不透明度（0 - 1）转换为十六进制（00 - ff）的首选方法是什么？

我的想法是使用if语句检查不透明度是否介于1和0.95之间，然后使用ff。努力工作到0。

Answer 1

在最基本的级别，您只是将小数转换为十六进制：How to convert decimal to hex in JavaScript?：

yourNum = yourNum.toString(16);

0.0 - 1.0范围只是0-255范围的百分比格式。因此，乘以你的值（例如0.5 * 255）然后转换为十六进制，你将得到正确的值。

Answer 2

根据其他答案的建议：

Math.floor(0.0 * 255).toString(16);   // Returns '00'
Math.floor(0.5 * 255).toString(16);   // Returns '75'
Math.floor(1.0 * 255).toString(16);   // Returns 'FF'

Answer 3

1. 乘以255（假设您的输入范围仅为0到1，并将其扩展为0-255）
2. Math.floor()
3. Convert that decimal number to the hex equivalent

Answer 4

这是播放十六进制颜色代码不透明度的简单功能。

const colour (colour, value) => {
  const opacity = Math.floor(0.1 * value * 255).toString(16);
  return colour + opacity;
};

colour (#172B4D, 5)

Answer 5

function applyOpacity(color, opacity) {
  if (typeof color !== 'string' || color.length !== 7) return color;

  if (opacity < 0) opacity = 0;
  else if (opacity > 100) opacity = 100;

  opacity = Math.round(opacity * 2.55);

  return color + opacity.toString(16).toUpperCase().padStart(2, '0');
}