首页 文章

令人愉悦的调色板随机颜色生成[关闭]

提问于
浏览
1

使用javascript,我喜欢它可以锁定某些颜色调色板,这可能是通过它的第一次迭代确定的,然后在整个游戏中保持松散 . 我很有意思,但是作者用Java写的 . 不幸的是,如果我能弄清楚应该在哪里发布它,我很乐意分享我的脚本 . 毫无疑问'd be numerous suggestions on bettering my code... Here'是我所指的发电机:Algorithm to randomly generate an aesthetically-pleasing color palette非常感谢提前!

3 回答

  • 3

    我喜欢第二个答案的article中的那个功能 .

    在JS中,使用s = 0.5和v = 0.95:

    function randomColor(){
      var golden_ratio_conjugate = 0.618033988749895,
          h = (Math.random() + golden_ratio_conjugate) % 1 *360,
          rgb = hsvToRgb(h, 50, 95);
      return "rgb("+rgb[0]+","+rgb[1]+","+rgb[2]+")";
    }
    
    /**
     * Converts an HSV color value to RGB. Conversion formula
     * adapted from http://en.wikipedia.org/wiki/HSL_and_HSV.
     * Assumes h is contained in the set [0, 360] and
     * s and l are contained in the set [0, 100] and
     * returns r, g, and b in the set [0, 255].
     *
     * @param   Number  h       The hue
     * @param   Number  s       The saturation
     * @param   Number  v       The value
     * @return  Array           The RGB representation
     */
    function hsvToRgb(h, s, v){
      var chroma = s * v / 10000,
          min = v / 100 - chroma,
          hdash = h / 60,
          x = chroma * (1 - Math.abs(hdash % 2 - 1)),
          r = 0, g = 0, b = 0;
    
      switch(true){
        case hdash < 1:
          r = chroma;
          g = x;
          break;
        case hdash < 2:
          r = x;
          g = chroma;
          break;
        case hdash < 3:
          g = chroma;
          b = x;
          break;
        case hdash < 4:
          g = x;
          b = chroma;
          break;
        case hdash < 5:
          r = x;
          b = chroma;
          break;
        case hdash <= 6:
          r = chroma;
          b = x;
          break;
      }
    
      r += min;
      g += min;
      b += min;
    
      return [Math.round(r * 255), Math.round(g * 255), Math.round(b * 255)];
    }
    
  • 0

    尽可能阅读Java代码和附带的说明 .

    写下更高级伪代码的“程序” . 诸如“将每种随机颜色与混合颜色混合”的陈述 . 将每个伪代码语句分解为几个更详细的伪代码片段 .

    将伪代码转换为JavaScript .

    注意:链接的代码不会产生令人愉悦的和谐色彩组合 . 它会产生随机组合,并通过与颜色混合来减少分离(白色建议用于柔和) .

    阅读颜色和谐理论,并提出更好的建议 .

  • 0

    它看起来像这样:

    function redColor(var red) {
        return (Math.floor(Math.random() * 256) + red) / 2;
    }
    

    制作红色,绿色和蓝色中的三个 . 然后,您可以使用DOM将HTML元素的背景设置为结果 . 或者,如果您只想提供颜色值,可以将它们绑在一起 . 你必须将它们作为3个单独的变量,因为我没有颜色的对象 .

    在JavaScript中设置背景:

    element.style.backgroundColor = rgb(redColor(greenColorToMix), greenColor(redColorToMix), blueColor(blueColorToMix));
    

相关问题