返回 "n"给定颜色的 JavaScript 函数(从深到浅)

Question

我想获取特定颜色的颜色范围来生成标签云。

假设用户输入了一些带有 RGB/HHHHHH 值的颜色，那么我想编写一个返回 RGB/的函数 f(color, no) HHHHHH 表示指定“颜色”的“无”从深色到浅色的不同深浅。然后，这些颜色将有助于显示具有相同阴影的不同颜色的不同标签。但我想避免其中出现黑白色调。

以下是 F({R:0, G:0, B:255}, 7) 的示例，它返回 7 蓝色阴影。

我不希望任何 RGB 组合都是如此，例如 (25, 150,150)。

是否可以使用 JavaScript 实现此功能，或者是否有任何 RGB 公式可以实现此功能？

Answer 1

function generate()
{
  var r = document.querySelector("#R").value%256;
  var g = document.querySelector("#G").value%256;
  var b = document.querySelector("#B").value%256;
  var str="";
  for(var i=0;i<7;i++)
  {
    r+=33;
    g+=33;
    b+=33;
    str+="<div class='swatch' style='background-color:rgb("+r+","+g+","+b+")'></div>";
  }
  document.querySelector("#op").innerHTML = str;
  console.log(str);
}

.swatch{width:50px;height:25px;margin:1px}

<div>R<input type="text" id="R"/></div>
<div>G<input type="text" id="G"/></div>
<div>B<input type="text" id="B"/></div>
<input type="button" onclick="generate()" value="Generate"/>
<div id="op">Generated Color shades</div>

你想在 jsbin 上看到这样的东西吗？ ？这是我使用 jQuery 构建的演示。

如果您有任何疑问，请告诉我。