Canvasでhex-colorを使う
HTMLで色を指定する時、「#ffffff」とか「#000」のようにしますよね。
これは、「hex-color」というらしいです。
昨日初めて知りました。
今まで名前を知らなかったことにびっくりです。
前回作ったものにhex-colorで色を付けました。
hex-colorとかっこよく書いてますが、一般的なやりかたです。
let step = 30;
for (let i = 0; i < canvas.width / step; i++) {
for (let j = 0; j < canvas.height / step; j++) {
let colors = [
"#58b4ae",
"#ffe277",
"#ffb367",
"#ffe2bc",
"#eb6383",
"#fa9191",
"#ffe9c5",
"#b4f2e1",
];
let rnd_color = Math.floor(Math.random(colors.length) * 10);
ctx.fillStyle = colors[rnd_color];
ctx.fillRect(i * step, j * step, step, step);
}
}
色は淡いものにしました。
「Color Hunt」を参考にしています。
https://colorhunt.co/
ウェブの色についてのサービスはいろいろありますね。
もっといろいろ集めてみようと思います。