HTML5是網頁開發中廣泛使用的一種語言，可以實現豐富的圖形和交互效果，包括使用代碼繪制人物形象。下面是一個HTML5繪制人物的代碼示例。

<!-- 創建畫布 -->
<canvas id="myCanvas" width="300" height="400"></canvas>
<!-- 將畫布與變量連接 -->
<script>
var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
</script>
<!-- 畫頭部 -->
<script>
ctx.beginPath();
ctx.arc(150, 75, 50, 0, 2 * Math.PI);
ctx.fillStyle = "#F3EFEF";
ctx.fill();
ctx.lineWidth = 3;
ctx.strokeStyle = "black";
ctx.stroke();
</script>
<!-- 畫眼睛 -->
<script>
ctx.beginPath();
ctx.arc(125, 60, 8, 0, 2 * Math.PI);
ctx.fillStyle = "white";
ctx.fill();
ctx.beginPath();
ctx.arc(175, 60, 8, 0, 2 * Math.PI);
ctx.fill();
ctx.beginPath();
ctx.arc(125, 60, 3, 0, 2 * Math.PI);
ctx.fillStyle = "black";
ctx.fill();
ctx.beginPath();
ctx.arc(175, 60, 3, 0, 2 * Math.PI);
ctx.fill();
</script>
<!-- 畫嘴巴 -->
<script>
ctx.beginPath();
ctx.arc(150, 95, 25, 0, Math.PI);
ctx.fillStyle = "#F3EFEF";
ctx.fill();
ctx.lineWidth = 2;
ctx.strokeStyle = "black";
ctx.stroke();
</script>
<!-- 畫身體 -->
<script>
ctx.beginPath();
ctx.rect(100, 125, 100, 175);
ctx.fillStyle = "#F3EFEF";
ctx.fill();
ctx.lineWidth = 2;
ctx.strokeStyle = "black";
ctx.stroke();
</script>
<!-- 畫手 -->
<script>
ctx.beginPath();
ctx.arc(75, 200, 10, 0, 2 * Math.PI);
ctx.fillStyle = "#F3EFEF";
ctx.fill();
ctx.lineWidth = 2;
ctx.strokeStyle = "black";
ctx.stroke();
ctx.beginPath();
ctx.arc(225, 200, 10, 0, 2 * Math.PI);
ctx.fill();
ctx.stroke();
</script>
<!-- 畫腳 -->
<script>
ctx.beginPath();
ctx.rect(110, 300, 25, 75);
ctx.fillStyle = "#F3EFEF";
ctx.fill();
ctx.stroke();
ctx.beginPath();
ctx.rect(165, 300, 25, 75);
ctx.fillStyle = "#F3EFEF";
ctx.fill();
ctx.stroke();
</script>

這段代碼使用HTML5的canvas標簽創建了一個300像素寬、400像素高的畫布。然后使用JavaScript代碼連接了畫布與變量，并使用canvas的API繪制人物的各個部位，包括頭部、眼睛、嘴巴、身體、手和腳。該代碼使用了許多canvas的API，如arc、rect、fillStyle、lineWidth、strokeStyle等等。通過對這些API的使用，我們可以輕松地繪制出復雜的圖形。