CANVAS PROJECT
My inspiration for this project is seen on the left - Raven from Teen Titans. The final product is seen on the right!
CODE
var bkgdgrd = context.createLinearGradient(272.5,420,mouseX,mouseY);
bkgdgrd.addColorStop(0,"rgba(32,3,74,1.00)");
bkgdgrd.addColorStop(0.25,"rgba(81,21,145,1.00)");
bkgdgrd.addColorStop(0.5,"rgba(182,111,246,1.00)");
bkgdgrd.addColorStop(0.75,"rgba(81,21,145,1.00)");
bkgdgrd.addColorStop(1,"rgba(32,3,74,1.00)");
context.beginPath();
context.rect(0,0,545,840);
context.closePath();
context.fillStyle = bkgdgrd;
context.fill();
///// CAPE
context.beginPath();
context.moveTo(129,148);
context.quadraticCurveTo(100,119,106,123);
context.quadraticCurveTo(98,120,134,7);
context.quadraticCurveTo(160,-8,223,14);
context.quadraticCurveTo(260,110,257,107);
context.quadraticCurveTo(210,185,219,153);
context.quadraticCurveTo(242,185,129,148);
context.closePath();
context.fillStyle = "#3E2683";
context.fill();
context.lineWidth = 1;
context.strokeStyle = "black"
context.stroke();
///// CAPE SHADOW
context.beginPath();
context.moveTo(129,148);
context.quadraticCurveTo(100,119,106,123);
context.quadraticCurveTo(98,120,131,106);
context.quadraticCurveTo(113,115,162,28);
context.quadraticCurveTo(200,8,189,13);
context.quadraticCurveTo(210,17,220,26);
context.quadraticCurveTo(218,25,225,23);
context.quadraticCurveTo(260,110,255,107);
context.quadraticCurveTo(255,105,251,115);
context.quadraticCurveTo(255,110,224,50);
context.lineTo(219,136);
context.lineTo(157,151);
context.lineTo(129,148);
//context.quadraticCurveTo(242,110,129,148);
context.closePath();
context.fillStyle = "#221E73";
context.fill();
context.lineWidth = 1;
context.strokeStyle = "#231E73"
context.stroke();
///// BLACK FACE SHADOW
context.beginPath();
context.moveTo(190,155);
context.quadraticCurveTo(143,125,135,106);
context.quadraticCurveTo(126,100,170,33);
context.lineTo(201,54);
context.lineTo(218,33);
//context.quadraticCurveTo(180,115,201,54);
//context.quadraticCurveTo(200,8,218,33);
context.quadraticCurveTo(217,17,248,112);
context.quadraticCurveTo(218,143,190,155);
context.closePath();
context.fillStyle = "black";
context.fill();
context.lineWidth = 1;
context.strokeStyle = "black"
context.stroke();
////// LEFT EYE
context.beginPath();
context.moveTo(152,68);
context.quadraticCurveTo(170,70,186,80);
context.quadraticCurveTo(154,97,152,68);
context.closePath();
context.fillStyle = "white";
context.fill();
context.lineWidth = 1;
context.strokeStyle = "white"
context.stroke();
///// RIGHT EYE
context.beginPath();
context.moveTo(197,77);
context.quadraticCurveTo(212,70,222,68);
context.quadraticCurveTo(216,95,197,77);
context.closePath();
context.fillStyle = "white";
context.fill();
context.lineWidth = 1;
context.strokeStyle = "white"
context.stroke();
////// NECK
context.beginPath();
context.moveTo(157,110);
context.lineTo(179,110);
context.lineTo(174,141);
context.quadraticCurveTo(154,128,155,126);
context.lineTo(157,110);
context.closePath()
context.fillStyle = "#6D6E74";
context.fill();
////// CHIN
context.beginPath();
context.moveTo(188,134);
context.quadraticCurveTo(162,127,145,102);
context.quadraticCurveTo(150,78,193,101);
context.bezierCurveTo(203,87,247,88,188,134);
context.closePath()
context.fillStyle = "#B2AFBC";
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
////// CHIN SHADOW
context.beginPath();
context.moveTo(188,134);
context.quadraticCurveTo(156,118,164,93);
context.quadraticCurveTo(165,87,193,101);
context.bezierCurveTo(203,87,247,88,188,134);
context.closePath()
context.fillStyle = "#666671";
context.fill();
//////////// CAPE///////////
///// LEFT SHOULDER
context.beginPath();
context.moveTo(163,157);
context.lineTo(106,167);
context.quadraticCurveTo(98,178,89,183);
context.quadraticCurveTo(93,168,97,155);
context.quadraticCurveTo(127,150,150,142);
context.lineTo(169,149);
context.lineTo(163,160);
context.closePath();
context.fillStyle = "#502E97";
context.fill();
context.lineWidth = 1;
context.strokeStyle = "black"
context.stroke();
///// LEFT SHOULDER SHADOW
context.beginPath();
context.moveTo(162,156);
context.lineTo(105,166);
context.quadraticCurveTo(96,178,91,181);
context.quadraticCurveTo(96,168,98,157);
context.lineTo(162,156);
context.closePath();
context.fillStyle = "#241E75";
context.fill();
///// BACK CAPE
context.beginPath();
context.moveTo(171,152);
context.lineTo(244,136);
context.quadraticCurveTo(440,555,355,606);
context.quadraticCurveTo(358,523,206,535);
context.quadraticCurveTo(130,557,33,520);
context.quadraticCurveTo(18,598,21,609);
context.quadraticCurveTo(-40,570,76,325);
context.quadraticCurveTo(100,120,90,202);
context.lineTo(171,152);
context.closePath();
context.fillStyle = "#221D73";
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
//// RIGHT BACK CAPE SHADOW
context.beginPath();
context.moveTo(265,182);
context.quadraticCurveTo(438,555,355,606);
context.quadraticCurveTo(384,555,265,182);
context.closePath();
context.fillStyle = "#3D2583"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
////// LEFT BACK CAPE SHADOW PART 1
context.beginPath();
context.moveTo(82,311);
context.quadraticCurveTo(-40,570,21,609);
context.quadraticCurveTo(18,570,82,311);
context.closePath();
context.fillStyle = "#3D2583"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
///// LEFT BACK CAPE SHADOW PART 2
context.beginPath();
context.moveTo(75,323);
context.lineTo(90,202);
context.quadraticCurveTo(95,290,75,323);
context.closePath();
context.fillStyle = "#3D2583"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
//////////////BODY////////////////
///// LEFT HAND
context.beginPath();
context.moveTo(61,360);
context.lineTo(51,353);
context.lineTo(29,372);
context.quadraticCurveTo(19,400,25,411);
context.lineTo(27,407);
context.lineTo(30,415);
context.quadraticCurveTo(32,381,46,377);
context.lineTo(45,369);
context.quadraticCurveTo(48,375,42,401);
context.quadraticCurveTo(52,390,54,378);
context.quadraticCurveTo(61,373,61,360);
context.closePath();
context.fillStyle = "#ABB5B8"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
////// LEFT HAND LINE 1
context.beginPath();
context.moveTo(27,407);
context.quadraticCurveTo(25,395,29,386);
context.quadraticCurveTo(25,395,27,407);
context.closePath();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
////// LEFT HAND LINE 2
context.beginPath();
context.moveTo(29,386);
context.quadraticCurveTo(27,390,39,363);
context.quadraticCurveTo(27,390,29,386);
context.closePath();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
/////// LEFT ARM
context.beginPath();
context.moveTo(123,254);
context.lineTo(26,374);
context.quadraticCurveTo(59,344,62,365);
context.lineTo(132,302);
context.lineTo(123,254);
context.closePath();
context.fillStyle = "black";
context.fill();
//// LEFT WRIST CUFF
context.beginPath();
context.moveTo(90,353);
context.quadraticCurveTo(95,330,69,319);
context.quadraticCurveTo(60,330,51,343);
context.quadraticCurveTo(66,345,70,360);
context.quadraticCurveTo(83,350,90,353);
context.closePath();
context.fillStyle = "#4C3098"
context.fill();
context.lineWidth = 3;
context.strokeStyle = "#251B59"
context.stroke();
//// LEFT WRIST CUFF SHADOW
context.beginPath();
context.moveTo(70,360);
context.quadraticCurveTo(75,340,70,324);
context.quadraticCurveTo(89,350,88,353);
context.closePath();
context.fillStyle = "#221D70"
context.fill();
context.lineWidth = 1.7;
context.strokeStyle = "#251B59"
context.stroke();
///// HAND GEM
context.beginPath();
context.moveTo(51,345);
context.quadraticCurveTo(45,353,33,364);
context.quadraticCurveTo(27,343,51,345);
context.closePath();
context.fillStyle = "#DFD1C0"
context.fill();
context.lineWidth = .7;
context.strokeStyle = "black"
context.stroke();
//// HAND GEM CENTER
context.beginPath();
context.moveTo(33,355);
context.quadraticCurveTo(42,350,45,345);
context.quadraticCurveTo(32,342,33,355);
context.closePath();
context.fillStyle = "black"
context.fill();
context.lineWidth = .7;
context.strokeStyle = "black"
context.stroke();
//// RED HAND GEM
context.beginPath();
context.arc(40,347,2,0,2*Math.PI,false);
context.closePath();
context.fillStyle = "#C0273D"
context.fill();
////// TORSO AND RIGHT ARM
context.beginPath();
context.moveTo(105,165);
context.quadraticCurveTo(141,165,172,154);
context.quadraticCurveTo(205,150,222,145);
context.quadraticCurveTo(260,152,301,150);
context.bezierCurveTo(319,136,342,110,402,122);
context.lineTo(412,130);
context.bezierCurveTo(374,153,353,180,301,176);
context.quadraticCurveTo(250,180,218,186);
context.quadraticCurveTo(210,220,187,256);
context.quadraticCurveTo(185,290,217,353);
context.lineTo(161,398);
context.lineTo(119,399);
context.lineTo(104,349);
context.quadraticCurveTo(108,307,113,295);
context.bezierCurveTo(120,235,40,200,105,165);
context.closePath();
context.fillStyle = "black"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
/// LEFT TORSO SHADOW 1
context.beginPath();
context.moveTo(130,215);
context.bezierCurveTo(95,258,133,220,112,367);
context.lineTo(104,357);
context.bezierCurveTo(140,230,60,219,83,185);
context.quadraticCurveTo(85,215,108,229);
context.bezierCurveTo(110,228,119,218,130,215);
context.closePath();
context.fillStyle = "#140A55"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "#08063B"
context.stroke();
///#08063B
//// LEFT TORSO SHADOW 2
context.beginPath();
context.moveTo(83,203);
context.quadraticCurveTo(85,215,108,235);
context.quadraticCurveTo(106,240,107,246);
context.quadraticCurveTo(85,215,83,203);
context.closePath();
context.fillStyle = "#2B1D73"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "#342779"
context.stroke();
//// RIGHT TORSO SHADOW 1
context.beginPath();
context.moveTo(197,339);
context.lineTo(168,350);
context.bezierCurveTo(123,270,175,220,170,215);
context.quadraticCurveTo(159,218,146,210);
context.quadraticCurveTo(181,204,198,173);
context.quadraticCurveTo(199,195,184,209);
context.quadraticCurveTo(184,217,183,220);
context.bezierCurveTo(167,240,143,303,197,339);
context.closePath();
context.fillStyle ="#271B77"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "#271B77"
context.stroke();
//// RIGHT TORSO SHADOW 2
context.beginPath();
context.moveTo(146,210);
context.quadraticCurveTo(181,204,198,173);
context.quadraticCurveTo(183,220,146,210);
context.closePath();
context.fillStyle = "#11064D"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "#11064D"
context.stroke();
//// RIGHT TORSO SHADOW 3
context.beginPath();
context.moveTo(175,348);
context.lineTo(168,350);
context.bezierCurveTo(123,270,175,220,170,215);
context.lineTo(176,214);
context.quadraticCurveTo(134,286,175,348);
//context.bezierCurveTo(123,270,175,220,175,348);
context.closePath();
context.fillStyle = "#11064D"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "#11064D"
context.stroke();
////// NECK GEM
context.beginPath();
context.arc(168,152,14,0,2*Math.PI,false);
context.closePath();
context.fillStyle = "#DED0BF"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
///// NECK GEM CENTER
context.beginPath();
context.arc(168,152,7,0,2*Math.PI,false);
context.closePath();
context.fillStyle = "#BB334F"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
//// NECK GEM CENTER SHADOW
context.beginPath();
context.moveTo(167,147);
context.bezierCurveTo(164,141,155,162,172,157);
context.quadraticCurveTo(161,154,167,147);
context.closePath();
context.fillStyle = "black"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
///// LEFT LEG
context.beginPath();
context.moveTo(103,349);
context.lineTo(158,395);
context.lineTo(215,496);
context.lineTo(212,640);
context.lineTo(187,523)
context.lineTo(178,516);
context.lineTo(176,498);
context.quadraticCurveTo(97,416,103,349);
context.closePath();
context.fillStyle = "#B1B7BD"
context.fill();
context.lineWidth = 1.9;
context.strokeStyle = "#65696D"
context.stroke();
///// LEFT LEG SHADOW
context.beginPath();
context.moveTo(104,349);
context.lineTo(158,395);
context.lineTo(170,418);
context.quadraticCurveTo(158,448,191,499);
context.lineTo(180,494);
context.quadraticCurveTo(185,513,199,531);
context.lineTo(212,640);
context.lineTo(189,523)
context.lineTo(180,516);
context.lineTo(178,498);
context.quadraticCurveTo(99,416,104,349);
context.closePath();
context.fillStyle = "#969BA0"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "#969BA0"
context.stroke();
//// left shoe
context.beginPath();
context.moveTo(216,675);
context.lineTo(210,738);
context.lineTo(114,745);
context.lineTo(118,735);
context.quadraticCurveTo(128,715,181,709);
context.quadraticCurveTo(200,701,195,682);
context.lineTo(216,675);
context.closePath();
context.fillStyle = "#482E93"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
//// left shoe top
context.beginPath();
context.moveTo(216,675);
context.lineTo(199,661);
context.lineTo(188,688);
context.lineTo(208,695);
context.lineTo(216,675);
context.closePath();
context.fillStyle = "#231F72"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
///// left shoe shadow
context.beginPath();
context.moveTo(213,695);
context.lineTo(207,734);
context.lineTo(127,737);
context.lineTo(132,729);
context.quadraticCurveTo(134,728,130,726);
context.lineTo(136,729);
context.quadraticCurveTo(158,718,185,715);
context.quadraticCurveTo(182,706,196,711);
context.quadraticCurveTo(190,696,213,695);
context.closePath();
context.fillStyle = "#251D6F"
context.fill();
context.lineWidth = .8;
context.strokeStyle = "#251D6F"
context.stroke();
//// left shoe bottom
context.beginPath();
context.moveTo(210,731);
context.lineTo(118,735);
context.lineTo(114,745);
context.lineTo(210,738);
context.closePath();
context.fillStyle = "black"
context.fill();
context.lineWidth = .8;
context.strokeStyle = "black"
context.stroke();
//// right shoe
context.beginPath();
context.moveTo(212,647);
context.lineTo(200,656);
context.lineTo(201,723);
context.quadraticCurveTo(143,762,126,795);
context.quadraticCurveTo(157,809,207,778);
context.quadraticCurveTo(208,756,236,749);
context.quadraticCurveTo(225,713,230,692);
context.lineTo(202,684);
context.closePath();
context.fillStyle = "#482E94"
context.fill();
context.lineWidth = 1.9;
context.strokeStyle = "black"
context.stroke();
//// right shoe shadow 2
context.beginPath();
context.moveTo(224,699);
context.lineTo(202,690);
context.lineTo(202,723);
context.quadraticCurveTo(147,762,127,795);
context.quadraticCurveTo(150,790,162,784);
context.quadraticCurveTo(161,780,151,776);
context.lineTo(163,763);
context.quadraticCurveTo(170,765,183,766);
context.lineTo(174,760);
context.quadraticCurveTo(192,761,200,752);
context.quadraticCurveTo(203,718,224,734);
context.quadraticCurveTo(222,726,217,724);
context.lineTo(224,699);
context.closePath();
context.fillStyle = "#231F72"
context.fill();
context.lineWidth = .8;
context.strokeStyle = "#231F72"
context.stroke();
///// right shoe top
context.beginPath();
context.moveTo(212,647);
context.lineTo(200,656);
context.lineTo(201,701);
context.lineTo(216,715);
context.lineTo(232,701);
context.lineTo(234,682);
context.lineTo(243,653);
context.lineTo(227,637);
context.lineTo(212,647);
context.closePath();
context.fillStyle = "#492F8E"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
///// right shoe top 2
context.beginPath();
context.moveTo(220,647);
context.lineTo(204,660);
context.lineTo(212,665);
context.quadraticCurveTo(233,664,238,654);
context.lineTo(220,647);
context.closePath();
context.fillStyle = "#232070"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
//// right shoe shadow
context.beginPath();
context.moveTo(201,662);
context.quadraticCurveTo(208,674,221,671);
context.quadraticCurveTo(230,677,214,712);
context.lineTo(202,700);
context.lineTo(201,662);
context.closePath();
context.fillStyle = "#231F72"
context.fill();
context.lineWidth = .8;
context.strokeStyle = "#231F72"
context.stroke();
/// bottom right shoe
context.beginPath();
context.moveTo(126,795);
context.quadraticCurveTo(157,809,207,778);
context.quadraticCurveTo(208,756,236,749);
context.lineTo(232,737);
context.quadraticCurveTo(212,745,206,760);
context.bezierCurveTo(181,778,154,792,133,785);
context.lineTo(126,795);
context.closePath();
context.fillStyle = "black"
context.fill();
context.lineWidth = .8;
context.strokeStyle = "black"
context.stroke();
///// RIGHT LEG
context.beginPath();
context.moveTo(158,395);
context.bezierCurveTo(145,305,245,255,232,523);
context.quadraticCurveTo(260,550,232,659);
context.quadraticCurveTo(225,664,212,663);
context.quadraticCurveTo(208,590,206,535);
context.lineTo(199,522);
context.lineTo(201,502);
context.quadraticCurveTo(184,479,158,395);
context.closePath();
context.fillStyle = "#B2B7BB"
context.fill();
context.lineWidth = 1.9;
context.strokeStyle = "#65696D"
context.stroke();
///// RIGHT LEG SHADOW
context.beginPath();
context.moveTo(211,663);
context.quadraticCurveTo(209,590,207,535);
context.lineTo(200,522);
context.lineTo(202,502);
context.bezierCurveTo(134,370,164,350,172,332);
context.bezierCurveTo(182,445,214,504,222,530);
context.lineTo(210,513);
context.bezierCurveTo(239,578,235,607,222,660);
context.quadraticCurveTo(217,664,211,663);
context.closePath();
context.fillStyle = "#969BA0"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "#969BA0"
context.stroke();
/// BELT LOOP
context.beginPath();
context.moveTo(106,362);
context.lineTo(103,355);
context.quadraticCurveTo(151,300,200,311);
context.lineTo(200,317);
context.quadraticCurveTo(155,304,106,362);
context.closePath();
context.fillStyle = "#D8D9C9"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
//// BELT CIRCLE 1 \\\\\
context.beginPath();
context.arc(105,352,10.7,0,2*Math.PI,false);
context.closePath();
context.fillStyle = "#D5D4C3"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
/// BELT CIRCLE 2
context.beginPath();
context.arc(104,352,6.8,0,2*Math.PI,false);
context.closePath();
context.fillStyle = "#000000"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
/// BELT CIRCLE 3
context.beginPath();
context.arc(103,351,4.9,0,2*Math.PI,false);
context.closePath();
context.fillStyle = "#C22B43"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
/// BELT CIRCLE 4 \\\\
context.beginPath();
context.arc(128,332,12,0,2*Math.PI,false);
context.closePath();
context.fillStyle = "#C9C7B7"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
/// BELT CIRCLE 5
context.beginPath();
context.arc(128,332,7.5,0,2*Math.PI,false);
context.closePath();
context.fillStyle = "#000000"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
/// BELT CIRCLE 6
context.beginPath();
context.arc(127,329,5,0,2*Math.PI,false);
context.closePath();
context.fillStyle = "#C22B43"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
/// BELT CIRCLE 7 \\\\
context.beginPath();
context.arc(160,317,13,0,2*Math.PI,false);
context.closePath();
context.fillStyle = "#C9C7B7"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
/// BELT CIRCLE 8
context.beginPath();
context.arc(160,317,7.3,0,2*Math.PI,false);
context.closePath();
context.fillStyle = "#000000"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
/// BELT CIRCLE 9
context.beginPath();
context.arc(159,315,5.3,0,2*Math.PI,false);
context.closePath();
context.fillStyle = "#C22B43"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
/// BELT CIRCLE 10 \\\\
context.beginPath();
context.arc(196,311,11,0,2*Math.PI,false);
context.closePath();
context.fillStyle = "#C9C7B7"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
/// BELT CIRCLE 11
context.beginPath();
context.arc(196,311,7,0,2*Math.PI,false);
context.closePath();
context.fillStyle = "#000000"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
/// BELT CIRCLE 12
context.beginPath();
context.arc(196,310,4.4,0,2*Math.PI,false);
context.closePath();
context.fillStyle = "#C22B43"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
//// LIP LINE
context.beginPath();
context.moveTo(178,116);
context.quadraticCurveTo(182,113,195,114);
context.closePath();
context.lineWidth = .5;
context.strokeStyle = "black"
context.stroke();
//// CHIN DENT
context.beginPath();
context.moveTo(185,121);
context.lineTo(189,120);
context.closePath();
context.lineWidth = .5;
context.strokeStyle = "black"
context.stroke();
////// RIGHT HAND CIRLE
context.beginPath();
context.arc(465,99,73,0,2*Math.PI,false);
context.closePath();
context.fillStyle = "black"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "black"
context.stroke();
///// RIGHT HAND
context.beginPath();
context.moveTo(425,112);
context.quadraticCurveTo(445,70,446,57);
context.quadraticCurveTo(455,78,446,92);
context.quadraticCurveTo(480,57,504,53);
context.quadraticCurveTo(476,72,470,90);
context.quadraticCurveTo(497,70,528,68);
context.quadraticCurveTo(517,86,483,106);
context.lineTo(524,111);
context.quadraticCurveTo(510,121,480,117);
context.quadraticCurveTo(457,136,435,130);
context.lineTo(425,112);
context.closePath();
context.lineWidth = 1.5;
context.strokeStyle = "white"
context.stroke();
///// RIGHT HAND LINE 1
context.beginPath();
context.moveTo(446,92);
context.quadraticCurveTo(444,97,448,99);
context.closePath();
context.fillStyle = "white"
context.fill();
context.lineWidth = 1;
context.strokeStyle = "white"
context.stroke();
///// RIGHT HAND LINE 2
context.beginPath();
context.moveTo(528,68);
context.lineTo(479,97);
context.closePath();
context.lineWidth = 1.5;
context.strokeStyle = "white"
context.stroke();
///// RIGHT HAND LINE 3
context.beginPath();
context.moveTo(452,116);
context.quadraticCurveTo(442,125,438,125);
context.closePath();
context.lineWidth = 1.5;
context.strokeStyle = "white"
context.stroke();
///// RIGHT HAND CUFF
context.beginPath();
context.moveTo(410,100);
context.quadraticCurveTo(420,107,430,95);
context.quadraticCurveTo(433,121,447,133);
context.quadraticCurveTo(429,142,417,150);
context.quadraticCurveTo(393,130,410,100);
context.closePath();
context.fillStyle = "black"
context.fill();
context.lineWidth = 1.5;
context.strokeStyle = "white"
context.stroke();
//// RIGHT ARM SHADOW
context.beginPath();
context.moveTo(220,165);
context.quadraticCurveTo(263,154,297,160);
context.lineTo(305,154);
context.quadraticCurveTo(302,159,308,160);
context.lineTo(319,151);
context.quadraticCurveTo(318,158,321,157);
context.quadraticCurveTo(334,137,349,132);
context.lineTo(344,141);
context.quadraticCurveTo(372,130,398,129);
context.quadraticCurveTo(347,142,316,166);
context.lineTo(314,160);
context.lineTo(302,171);
context.quadraticCurveTo(304,167,300,163);
context.lineTo(297,169);
context.lineTo(297,165);
context.quadraticCurveTo(261,165,220,165);
context.closePath();
context.fillStyle = "#2C1D83"
context.fill();
context.lineWidth = .8;
context.strokeStyle = "#2C1D83"
context.stroke();
Comments
Post a Comment