Canvas_Coding1
Code: <!DOCTYPE HTML> <html> <head> <meta charset="UTF-8"> <title> Dream Big </title> <style type="text/css"> body,td,th { font-family: Helvetica, Arial, sans-serif; font-size: 12px; color: #000; } </style> </head> <body> <canvas id="myCanvas" width="600" height="600"></canvas> <script> var canvas = document.getElementById('myCanvas'); var context = canvas.getContext('2d'); //BLUE BACKGROUND context.beginPath(); context.rect(0, 0, 600, 600); var grd = context.createLinearGradient(300, 0, 300, 500); grd.addColorStop(0, "rgb(160,250,300)"); context.fillStyle = grd; context.fill(); //CIRCLE context.beginPath(); context.arc(400,300,150,0*Math.PI, 2*Math.PI,true); context.closePath var grd = context.createLinearGradient(300,-110,300,800); grd.addColorStop(0,"rgba(255,0,0,.2)"