Canvas How to - Set fill style with hex color value

Question

We would like to know how to set fill style with hex color value.

Answer


<!--from w  ww  . j av a2 s  .  c o  m-->
<!DOCTYPE html>
<html>
<head>
<script type='text/javascript'>
window.onload=function(){
    var canvas = document.getElementById('canvas');
    var c = canvas.getContext('2d');
    c.fillStyle = '#cccccc'
    c.beginPath();
    c.arc(100, 100, 100, 0, 360, false);
    c.fill();
}
</script>
</head>
<body>
  <canvas id="canvas" width="400" height="200"></canvas>
</body>
</html>

The code above is rendered as follows: