SOURCE

function draw(){
    const canvas = document.getElementById('canvas')
    const ctx = canvas.getContext('2d')
    const gradient = ctx.createRadialGradient(100,100,20,100,100,50)
    gradient.addColorStop(0,'#f00')
    gradient.addColorStop(0.5, '#0f0')
    gradient.addColorStop(1, '#00f')
    ctx.fillStyle = gradient
    ctx.arc(100,100,50,0,Math.PI*2)
    ctx.fill()
}

draw()

<canvas id="canvas" width="1000px" height="1000px"></canvas>