js动态生成颜色浅的16进制值

JavaScript016

js动态生成颜色浅的16进制值,第1张

调用的例子:

console.log(ColorLuminance(colorRGB(),0.5))  //先自动生成16进制颜色,在转成比原有颜色轻50%;

//16进制随机颜色

        function colorRGB(){

            return '#' + (function (h) {

                return new Array(7 - h.length).join("0") + h

            })((Math.random() * 0x1000000 << 0).toString(16))

        }

ColorLuminance接受两个参数:

参数1: 十六进制颜色值,例如“#abc”或“#123456”(散列是可选的)

参数2: 亮度因数,即,-0.1是10%更暗,0.2是轻20%等。

function ColorLuminance(hex, lum) {

            // validate hex string

            hex = String(hex).replace(/[^0-9a-f]/gi, '')

            if (hex.length < 6) {

                hex = hex[0]+hex[0]+hex[1]+hex[1]+hex[2]+hex[2]

            }

            lum = lum || 0

            // convert to decimal and change luminosity

            var rgb = "#", c, i

            for (i = 0 i < 3 i++) {

                c = parseInt(hex.substr(i*2,2), 16)

                c = Math.round(Math.min(Math.max(0, c + (c * lum)), 255)).toString(16)

                rgb += ("00"+c).substr(c.length)

            }

            return rgb

        }

相关资源:https://blog.csdn.net/dingshi7798/article/details/105829757

收集一个函数:获取随机颜色值

复制代码

代码如下:

function

getRandomColor(){

return

"#"+("00000"+((Math.random()*16777215+0.5)>>0).toString(16)).slice(-6)

}

说明:

1、16777215为16进制的颜色ffffff转成10进制的数字

2、>>数字取整

3、转成16进制不足6位的以0来补充

在线演示代码:

js随机颜色

document.writeln('#'+('00000'+(Math.random()*0x1000000

昨天在做js

从10种颜色中随机取色,并每次取出的颜色不同的时候,考虑了很多,最终用如下来实现:

复制代码

代码如下:

var

colorList

=

["#FFFF99","#B5FF91","#94DBFF","#FFBAFF","#FFBD9D","#C7A3ED","#CC9898","#8AC007","#CCC007","#FFAD5C"]

for(var

i=0i<lineList.lengthi++){

var

bgColor

=

getColorByRandom(colorList)

}

function

getColorByRandom(colorList){

var

colorIndex

=

Math.floor(Math.random()*colorList.length)

var

color

=

colorList[colorIndex]

colorList.splice(colorIndex,1)

return

color

}

这样便能每次取出的颜色是随机的且都不一样