JavaScript»キャンバス»fillStyleで色指定 四角形に色をつける

ファイル名: js-canvas/quest_00045.html

下のソースコードをうつして、図のようなピンク色の四角形をかいてみましょう。

ソースコードには、キャンバスを作るところが書かれていません。「四角形をかいてみる」などと見くらべながら、必要ひつようなところはおぎなってください。

ソースコード

const canvas = document.getElementById("colored_rect");
const context = canvas.getContext("2d");

context.fillStyle = "rgb(255, 192, 203)";
context.fillRect(80, 80, 100, 100);

解説

rgbは、Red(赤)Green(緑)Blue(青)のことです。「光の三原色」といって、3つの色の組み合わせによってたくさんの色が作れます。