Back
Syntax
Study
Editor
Mode:
HTML
CSS
JavaScript
PHP
Reset
Run »
HTML / CSS / JS
<canvas id="myCanvas" width="300" height="150" style="border:1px solid #ccc;"></canvas> <script> const ctx = document.getElementById("myCanvas").getContext("2d"); // Rectangle ctx.fillStyle = "steelblue"; ctx.fillRect(20, 20, 100, 70); // Text ctx.fillStyle = "white"; ctx.font = "16px Arial"; ctx.fillText("Canvas!", 40, 62); // Circle ctx.beginPath(); ctx.arc(230, 75, 40, 0, Math.PI * 2); ctx.fillStyle = "coral"; ctx.fill(); </script>
Result
Open