使用canvas绘制6X6调色盘

 

<canvas id="canvas" height="150" width="150"></canvas>

var canvas = document.getElementById('canvas')

        var ctx = canvas.getContext('2d')

        for (var i = 0; i < 6; i++) {
            for (var j = 0; j < 6; j++) {
                // 每块填充色
                    ctx.fillStyle = 'rgb(' + Math.floor(255 - 42.5 * j) + ',' + Math.floor(255 - 42.5 * i) + ', 0)'
                // 位置 
                    ctx.fillRect(25 * i, 25 * j, 25, 25)

            }
        }

结果：