Suffering SuckaSTACHE.

I would really like to know you more, but in order to do that I moustache you a question. And nobody sees this blog anyway. I guess I'll have to shave it for later. Again, hi mom.

I'd love to stay and tell you more about this, but I really MOUST DASH. My coffee supply is depleting.


EJECT.

HSTB, Humane Society Tuberculosis.

"Follow the contour of my beautiful blob." - Dana Corrigan

Well said, Dana. I'm slapping these logos up on the blog in order to keep them intact, and to show all of my friends, but it's mainly for my mom.

Hi mom.

Humane Society of Tampa Bay:

Shine bright like a diamond, except they reflect light, not shine.

1. Diamond Bookstore:
This is an incredible logo that represents a diamond, as well as a book. It's kind of like Rihanna and her "hit" (cough, Chris Brown, cough) song, "Shine Bright Like a Diamond." Rihanna should read a book, and know that diamonds don't shine, they sparkle. The text below the graphic is a very classic look and definitely ties the aspect of having a diamond, with the texture of book pages in the logo. The logo does give it a very classy and almost couture feel, possibly gearing it towards older or a richer target audience. Either way, this logo is novel-ous. Marvelous? No? Ok.

 2. Sharky:
This is obviously the word "Sharky," with a shark silhouette rising up from the deep. The blue is a great choice that gives it a bit of a retro feel while linking it towards the ocean. The great white text is very similar to the Discovery Channel "Shark Week" font, and that could've been intentional. The logo is probably geared towards both genders as it isn't too manly or feminine, and is extremely simple allowing for everyone's interpretation. It's a clever usage of a shark fin and the shark form coming up from the deep blue ocean. I enjoy it, and I like sharks.  Jaws-t look at it, it's fantastic!

3. Helium:
Helium is a logo that is very basic, the letters in a generic font. Although the slight variation in the blue font for the dot on the "i" is very pleasing to my "eye". The u and m are also connected while none of the other letters are, it really does make me question it, as if to say "umm." The dot on the i seems to be floating away. Bye bye, dot on the i. I believe it's a design probably geared to a young adult audience as it's whimsical, but still professional. This logo is bringing new meaning to Defying Gravity.

4. Spoon:
A simple logo, with a simple spoon in place of the p. It is a very simplistic design, and very straight forward. The font is almost whimsical, and makes me want to go watch children's cartoons. It's almost encouraging children to go to the kitchen and learn how to cook, because that's obviously important. Especially in marriage, spooning is a big deal. It's an even bigger deal if someone fork-ets about the anniversary! Or the mayo on the sandwich. The logo is probably geared towards a young to middle aged adult audience, as they're the ones likely to spoon more often, if you know what I mean.

5. Ass:
 The company is obviously a company that has its "shit" together. The creative use of font spells out the word as well as insinuates what's actually going on down in the backseat. The company is probably useless, but the logo is bangin'. If Nicki Minaj endorsed a company, her boom ba doom boom bass would be all up on that. Yeah, I'm done. This was too much twerque, I think it's time we get to the bottom of these terrible puns. I hope this post made you crack up.


WOW, that was a butt load of terrible puns. I'll be back on Bun-day.


Now I'm done.

Humane Society, Logo Design.

Dogs, cats, and rodents, oh my.

Well, the rodents need to be added, but you get the point.

The Pun That We Will Make.

Here are my ideas for a logo in a business that may or may not exist.

Humane Society of Tampa Bay - Animal Shelter

Couch Potato - Interior Design Consultants

Hairephenelia, Barber Black Sheep, Hair Force One - Hair Salons

Sofa So Good - Furniture Store

Brewed Awakening - Coffee Shop



At least I won't be doing a hot dog stand.

Slightly Less Than Average Mario Brothers!

It's late. No puns right now.

And nearing one in the morning, I believe I'm starting to hallucinate kind of like the mushroom's that Mario eats. He gets bigger, I lose sanity.

Not a fair trade.

CODE

<!DOCTYPE HTML>

<html>

<head>

<script>

window.onload = function() {

var canvas = document.getElementById("myCanvas");

var context = canvas.getContext("2d");

////////////////////////////////////// start below this line ˇˇˇˇˇˇˇˇˇˇ

/*

context.beginPath();

context.rect(0,0,800,600);

var grd = context.createLinearGradient(400,300,400,600);

context.addColorStop(0,'rgb(150,150,255)');

context.addColorStop(1,'rgb(175,175,255)');

context.fillStyle = grd;

context.fill();

context.stroke();

*/

context.beginPath();

context.rect(0,0,800,600);

context.lineWidth = .1;

var grd = context.createLinearGradient(400,0,400,600);

grd.addColorStop(0, '#699cf9');

grd.addColorStop(1, '#90c1f8');

context.fillStyle = grd;

context.strokeStyle = '#90c1f8';

context.fill();

context.stroke();

/*

///Failed Question Mark Blocks..

context.beginPath();

context.rect(550,200,75,75);

context.lineWidth = 5;

context.lineCap = 'round';

context.strokeStyle = 'black';

context.fillStyle = '#be8f08';

context.fill();

context.stroke();

context.closePath();

context.beginPath();

context.moveTo(550,200);

context.arcTo(

context.stroke();

var x = 550;

var y = 200;

var w = 75;

var h = 75;

var radius = 20;

var r = x + w;

var b = y + h;

context.beginPath();

context.strokeStyle= 'black';

context.lineWidth="4";

context.moveTo(x+radius, y);

context.lineTo(r-radius, y);

context.quadraticCurveTo(r, y, r, y+radius);

context.lineTo(r, y+h-radius);

context.quadraticCurveTo(r, b, r-radius, b);

context.lineTo(x+radius, b);

context.quadraticCurveTo(x, b, x, b-radius);

context.lineTo(x, y+radius);

context.quadraticCurveTo(x, y, x+radius, y);

context.fillStyle = '#be8f08';

context.fill();

context.stroke();

context.closePath();

var x1 = 200;

var y1 = 200;

var w1 = 50;

var h1 = 50;

var radius = 20;

var r = x + w;

var b = y + h;

context.beginPath();

context.strokeStyle= 'black';

context.lineWidth="4";

context.moveTo(x1+radius, y1);

context.lineTo(r-radius, y1);

context.quadraticCurveTo(r, y1, r, y1+radius);

context.lineTo(r, y+h-radius);

context.quadraticCurveTo(r, b, r-radius, b);

context.lineTo(x1+radius, b);

context.quadraticCurveTo(x1, b, x1, b-radius);

context.lineTo(x1, y1+radius);

context.quadraticCurveTo(x1, y1, x1+radius, y1);

context.fillStyle = '#be8f08';

context.fill();

context.stroke();

*/

//End failed question mark blocks.. ^

//Green Tower

context.beginPath();

context.rect(125,214.5,175,514.5);

context.lineWidth = 5;

context.strokeStyle = '#6cb38a';

context.fillStyle = '#9ee1a8';

context.fill();

context.stroke();

context.closePath();

//inner green rectangle tower

context.beginPath();

context.rect(135,224.5,155,514.5);

context.lineWidth = 5;

context.strokeStyle = '#88c790';

context.fillStyle = '#88c790';

context.fill();

context.stroke();

context.closePath();

//top left angle, green box

context.beginPath();

context.moveTo(129,224.5);

context.lineTo(135,224.5);

context.lineTo(135,218.5);

context.lineWidth = 3;

context.strokeStyle = '#68b27c';

context.stroke();

context.closePath();

//shading right side green rectangle

context.beginPath();

context.rect(290,224.5, 6.5,400);

context.fillStyle = '#76a97e';

context.fill();

context.stroke();

context.closePath();

//triangle angle shading top right green triangle

context.beginPath();

context.moveTo(288,224.5);

context.lineTo(300,214.5);

context.lineTo(300,224.5);

context.fillStyle = '#76a97e';

context.fill();

context.stroke();

//top right angle, green box

context.beginPath();

context.moveTo(288,224.5);

context.lineTo(294,224.5);

context.lineTo(294,218.5);

context.lineWidth = 3;

context.strokeStyle = '#6bb47e';

context.stroke();

context.closePath();

//base big block, coral

context.beginPath();

context.rect(237.5,340,162.5,514.5);

context.strokeStyle = '#e9a26a';

context.lineWidth = 5;

context.fillStyle = '#fccf97';

context.fill();

context.stroke();

context.closePath();

//inner big block, coral

context.beginPath();

context.rect(247.5,350,142.5,514.5);

context.strokeStyle = '#f0b780';

context.lineWidth = 5;

context.fillStyle = '#f0b780';

context.fill();

context.stroke();

context.closePath();

//top left angle, coral

context.beginPath();

context.moveTo(241.5,350);

context.lineTo(247.5,350);

context.lineTo(247.5,345);

context.strokeStyle = '#e2a475';

context.lineWidth = 3;

context.stroke();

context.closePath();

//top right triangle shading, coral

context.beginPath();

context.moveTo(390,350);

context.lineTo(400,340);

context.lineTo(400,350);

context.strokeStyle = '#bd9b71';

context.fillStyle = '#bd9b71';

context.fill();

context.stroke();

context.closePath();

//right side shading, coral

context.beginPath();

context.rect(390,350,10,400);

context.strokeStyle = '#bd9b71';

context.fillStyle = '#bd9b71';

context.fill();

context.stroke();

context.closePath();

//top right angle, coral

context.beginPath();

context.moveTo(385,350);

context.lineTo(391,350);

context.lineTo(391,345);

context.strokeStyle = '#e2a475';

context.fillStyle = 'rgba(0,0,0,0)';

context.lineWidth = 3;

context.stroke();

context.fill();

context.closePath();

//green man #4 (one to the left on top)

context.beginPath();

context.moveTo(80,350);

context.lineTo(80,320);

context.lineWidth = 5;

context.strokeStyle = 'black';

context.stroke();

context.beginPath();

context.arc(142.8,320,20*Math.PI,21*Math.PI,false);

context.strokeStyle = 'black';

context.fillStyle = '#009f00';

context.lineWidth = 5;

context.fill();

context.stroke();

context.beginPath();

context.moveTo(205.4,320);

context.lineTo(205.4,425);

context.strokeStyle = 'black';

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.rect(85,320,115.6,200);

context.fillStyle = '#009f00';

context.strokeStyle = '#009f00';

context.fill();

context.stroke();

context.beginPath();

context.rect(130,280,3,3);

context.fillStyle = 'black';

context.strokeStyle = 'black';

context.fill();

context.stroke();

context.beginPath();

context.rect(155,280,3,3);

context.fillStyle = 'black';

context.strokeStyle = 'black';

context.fill();

context.stroke();

/*

context.beginPath();

context.rect(125,395,100,50);

context.fillStyle = '#009f00';

context.strokeStyle = '#009f00';

context.fill();

context.stroke();

*/

//green man #5, I'm dying! ... REMIX.

context.beginPath();

context.arc(300,460,20*Math.PI,21*Math.PI,false);

context.fillStyle = '#009f00';

context.strokeStyle = 'black';

context.lineWidth = 5;

context.fill();

context.stroke();

context.beginPath();

context.moveTo(362.5,460);

context.lineTo(362.5,580);

context.strokeStyle = 'black';

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.rect(250,460,108,100);

context.fillStyle = '#009f00';

context.strokeStyle = '#009f00';

context.fill();

context.stroke();

context.beginPath();

context.rect(285,420,3,3);

context.strokeStyle = 'black';

context.stroke();

context.beginPath();

context.rect(310,420,3,3);

context.strokeStyle = 'black';

context.stroke();

//green man #3 Line (left side)

context.beginPath();

context.moveTo(50,516);

context.lineTo(50,400);

context.strokeStyle = 'black';

context.lineWidth = 5;

context.fill();

context.stroke();

context.closePath();

context.beginPath();

context.arc(112.8,400,20*Math.PI,21*Math.PI,false);

context.fillStyle = '#009f00';

context.lineWidth = 5;

context.strokeStyle = 'black';

context.fill();

context.stroke();

context.beginPath();

context.rect(55,400,115.6,200);

context.fillStyle = '#009f00';

context.strokeStyle = '#009f00';

context.fill();

context.stroke();

context.closePath();

context.beginPath();

context.moveTo(175.6,400);

context.lineTo(175.6,406);

context.strokeStyle = 'black';

context.lineWidth = 5;

context.stroke();

context.closePath();

//eyes green man #3

context.beginPath();

context.rect(125,355,3,3);

context.fillStyle = 'black';

context.strokeStyle = 'black';

context.fill();

context.stroke();

context.closePath();

//eyes green man #3

context.beginPath();

context.rect(100,355,3,3);

context.fillStyle = 'black';

context.strokeStyle = 'black';

context.fill();

context.stroke();

context.closePath();

//green man #2

context.beginPath();

context.arc(180,465,20*Math.PI,21*Math.PI,false);

context.closePath();

context.fillStyle = '#009f00'

context.lineWidth = 5;

context.strokeStyle = 'black';

context.fill();

context.stroke();

//green man line cover up #2

context.beginPath();

context.rect(115,464,100,200);

context.fillStyle = '#009f00';

context.strokeStyle = '#009f00';

context.fill();

context.stroke();

context.closePath();

//green man #2 left eye

context.beginPath();

context.rect(165,428,3,3);

context.fillStyle = 'black';

context.strokeStyle = 'black';

context.fill();

context.stroke();

context.closePath();

//green man #2 right eye

context.beginPath();

context.rect(190,428,3,3);

context.fillStyle = 'black';

context.strokeStyle = 'black';

context.fill();

context.stroke();

context.closePath();

//attempted green man #1

context.beginPath();

context.arc(250,520,20*Math.PI,30*Math.PI,false);

context.closePath();

context.fillStyle = '#009f00';

context.lineWidth = 5;

context.strokeStyle = 'black';

context.fill();

context.stroke();

//green man #1's left eye

context.beginPath();

context.rect(235,480,3,3);

context.fillStyle = 'black';

context.fill();

context.stroke();

context.closePath();

//green man #1's right eye

context.beginPath();

context.rect(260,480,3,3);

context.fillStyle = 'black';

context.fill();

context.stroke();

context.closePath();

//teal box, lower right.

context.beginPath();

context.moveTo(700,300);

context.lineTo(700,400);

context.lineTo(850,800);

context.lineTo(850,290);

context.lineTo(710,290);

context.quadraticCurveTo(700,290,700,300);

context.strokeStyle = 'black';

context.fillStyle = 'rgb(88,200,247)';

context.lineWidth = 5;

context.fill();

context.stroke();

//coral box, lower right

context.beginPath();

context.moveTo(600,400);

context.lineTo(600,500);

context.quadraticCurveTo(600,515,610,515);

context.lineTo(750,515);

context.quadraticCurveTo(760,515,760,505);

context.lineTo(760,400);

context.quadraticCurveTo(760,390,750,390);

context.lineTo(610,390);

context.quadraticCurveTo(600,390,600,400);

context.fillStyle = 'rgb(247,143,70)';

context.lineWidth = 5;

context.strokeStyle = 'black';

context.fill();

context.stroke();

context.closePath();

//coral box's screws

context.beginPath();

context.arc(620,410,8,0,2*Math.PI,false);

context.lineWidth = 3;

context.strokeStyle = 'black';

context.fillStyle = 'white';

context.fill();

context.stroke();

context.beginPath();

context.moveTo(615,415);

context.lineTo(625,405);

context.lineWidth = 3;

context.strokeStyle = 'red';

context.stroke();

context.beginPath();

context.arc(740,410,8,0,2*Math.PI,false);

context.lineWidth = 3;

context.strokeStyle = 'black';

context.fillStyle = 'white';

context.fill();

context.stroke();

context.beginPath();

context.moveTo(735,415);

context.lineTo(745,405);

context.lineWidth = 3;

context.strokeStyle = 'red';

context.stroke();

context.beginPath();

context.arc(620,500,8,0,2*Math.PI,false);

context.lineWidth = 3;

context.strokeStyle = 'black';

context.fillStyle = 'white';

context.fill();

context.stroke();

context.beginPath();

context.arc(740,500,8,0,2*Math.PI,false);

context.lineWidth = 3;

context.strokeStyle = 'black';

context.fillStyle = 'white';

context.fill();

context.stroke();

context.beginPath();

context.moveTo(735,505);

context.lineTo(745,495);

context.lineWidth = 3;

context.strokeStyle = 'red';

context.stroke();

context.beginPath();

context.moveTo(615,505);

context.lineTo(625,495);

context.lineWidth = 3;

context.strokeStyle = 'red';

context.stroke();

//blue box's screw

context.beginPath();

context.arc(720,310,8,0,2*Math.PI,false);

context.lineWidth = 3;

context.strokeStyle = 'black';

context.fillStyle = 'white';

context.fill();

context.stroke();

context.beginPath();

context.moveTo(725,305);

context.lineTo(715,315);

context.lineWidth = 3;

context.strokeStyle = 'red';

context.stroke();

//blue box shadow.

context.beginPath();

context.moveTo(760,400);

context.lineTo(780,400);

context.quadraticCurveTo(785,400,785,405);

context.lineTo(790,800);

context.lineTo(760,800);

context.strokeStyle = 'rgba(0,0,0,.0)';

context.fillStyle = 'rgba(0,0,0,.4)';

context.fill();

context.stroke();

/*

//brick block

context.beginPath();

context.moveTo(520,270);

context.lineTo(520,310);

context.quadraticCurveTo(520,315,525,315);

context.lineTo(565,315);

context.quadraticCurveTo(570,315,570,310);

context.lineTo(570,270);

context.quadraticCurveTo(570,265,565,265);

context.lineTo(525,265);

context.quadraticCurveTo(520,265,520,270);

context.lineWidth = 3;

context.fillStyle = 'gold';

context.strokeStyle = 'black';

context.fill();

context.stroke();

*/

//bottom set of gold cubes

context.beginPath();

context.moveTo(450,370);

context.lineTo(450,410);

context.quadraticCurveTo(450,415,455,415);

context.lineTo(495,415);

context.quadraticCurveTo(500,415,500,410);

context.lineTo(500,370);

context.quadraticCurveTo(500,365,495,365);

context.lineTo(455,365);

context.quadraticCurveTo(450,365,450,370);

context.lineWidth = 3;

context.strokeStyle = 'black';

context.fillStyle = 'gold';

context.fill();

context.stroke();

context.beginPath();

context.moveTo(500,370);

context.lineTo(500,410);

context.quadraticCurveTo(500,415,505,415);

context.lineTo(545,415);

context.quadraticCurveTo(550,415,550,410);

context.lineTo(550,370);

context.quadraticCurveTo(550,365,545,365);

context.lineTo(505,365);

context.quadraticCurveTo(500,365,500,370);

context.lineWidth = 3;

context.strokeStyle = 'black';

context.fillStyle = 'gold';

context.fill();

context.stroke();

//bottom block thing

context.beginPath();

context.rect(0,514.5,800,30);

context.closePath();

var grd = context.createLinearGradient(400,514.5,400,550);

grd.addColorStop(0,'#eb9460');

grd.addColorStop(.75, '#9f5a2f'); 

context.fillStyle = grd;

context.strokeStyle = 'black';

context.fill();

context.stroke();

//bottom big block thing

context.beginPath();

context.rect(-10,534.5,900,100);

var grd = context.createLinearGradient(-10,534.5,800,550);

grd.addColorStop(0, '#aa5f22');

grd.addColorStop(1, '#933c00');

context.lineWidth = 0;

context.fillStyle = grd;

context.fill();

context.stroke();

context.closePath();

//triangle shine

context.beginPath();

context.rect(0,536.5,800,5);

context.strokeStyle = 'rgba(255,255,255,.0)';

context.lineWidth = 0;

context.fillStyle = 'rgba(255,255,255,.5)';

context.fill();

context.stroke();

context.closePath();

////////////////////////////////////// end above this line ˆˆˆˆˆˆˆˆˆˆˆˆˆˆˆ

};

</script>

</head>

<body>

<canvas id="myCanvas" width="800" height="600"></canvas>

</body>

</html>

This is HEART Work!

 

You aorta know, that I spent much too long on this.



"Yeah, no, don't sign me up for cardio."

- Fat Amy 

She gets me.

<!DOCTYPE HTML>
<html>
<head>
<script>
window.onload = function() {
var canvas = document.getElementById("myCanvas");
var context = canvas.getContext("2d");

////////////////////////////////////// start below this line ??????????
context.beginPath();
context.rect(0,0,800,600);
context.lineWidth = 25;
var grd = context.createLinearGradient(0,0,800,600);
grd.addColorStop(0, 'rgb(100,125,255)');
grd.addColorStop(1, 'lightgrey');
context.fillStyle = grd;
context.strokeStyle = 'lightgrey';
context.fill();
context.stroke();

context.beginPath();
context.moveTo(0,100);
context.lineTo(400,450);
context.lineWidth = 5;
context.strokeStyle = 'lightgrey';
context.stroke();

context.moveTo(800,100);
context.lineTo(400,450);
context.lineWidth = 5;
context.strokeStyle = 'lightgrey';
context.stroke();

context.moveTo(800,200);
context.lineTo(400,450);
context.lineWidth = 5;
context.strokeStyle = 'lightgrey';
context.stroke();

context.moveTo(800,300);
context.lineTo(400,450);
context.lineWidth = 5;
context.strokeStyle = 'lightgrey';
context.stroke();

context.moveTo(800,400);
context.lineTo(400,450);
context.lineWidth = 5;
context.strokeStyle = 'lightgrey';
context.stroke();

context.moveTo(800,500);
context.lineTo(400,450);
context.lineWidth = 5;
context.strokeStyle = 'lightgrey';
context.stroke();

context.moveTo(800,600);
context.lineTo(400,450);
context.lineWidth = 5;
context.strokeStyle = 'lightgrey';
context.stroke();

context.moveTo(700,600);
context.lineTo(400,450);
context.lineWidth = 5;
context.strokeStyle = 'lightgrey';
context.stroke();

context.moveTo(600,600);
context.lineTo(400,450);
context.lineWidth = 5;
context.strokeStyle = 'lightgrey';
context.stroke();

context.moveTo(500,600);
context.lineTo(400,450);
context.lineWidth = 5;
context.strokeStyle = 'lightgrey';
context.stroke();

context.moveTo(400,600);
context.lineTo(400,450);
context.lineWidth = 5;
context.strokeStyle = 'lightgrey';
context.stroke();

context.moveTo(0,200);
context.lineTo(400,450);
context.lineWidth = 5;
context.strokeStyle = 'lightgrey';
context.stroke();

context.moveTo(0,300);
context.lineTo(400,450);
context.lineWidth = 5;
context.strokeStyle = 'lightgrey';
context.stroke();

context.moveTo(0,400);
context.lineTo(400,450);
context.lineWidth = 5;
context.strokeStyle = 'lightgrey';
context.stroke();

context.moveTo(0,500);
context.lineTo(400,450);
context.lineWidth = 5;
context.strokeStyle = 'lightgrey';
context.stroke();

context.moveTo(0,600);
context.lineTo(400,450);
context.lineWidth = 5;
context.strokeStyle = 'lightgrey';
context.stroke();

context.moveTo(100,600);
context.lineTo(400,450);
context.lineWidth = 5;
context.strokeStyle = 'lightgrey';
context.stroke();

context.moveTo(200,600);
context.lineTo(400,450);
context.lineWidth = 5;
context.strokeStyle = 'lightgrey';
context.stroke();

context.moveTo(300,600);
context.lineTo(400,450);
context.lineWidth = 5;
context.strokeStyle = 'lightgrey';
context.stroke();






context.beginPath();
context.moveTo(400,250);
context.bezierCurveTo(200,85,200,300,400,450);
context.lineWidth = 5;
context.strokeStyle = 'black';
context.stroke();

context.moveTo(400,250);
context.bezierCurveTo(600,85,600,300,400,450);
context.lineWidth = 5;
context.strokeStyle = 'black';
context.stroke();

/*
context.moveTo(400,300);
context.bezierCurveTo(400,100,100,1,400,500);
context.lineWidth = 5;
context.strokeStyle = 'black';
context.stroke();

context.moveTo(400,300);
context.bezierCurveTo(400,100,700,1,400,500);
context.lineWidth = 5;
context.strokeStyle = 'black';
context.stroke();
*/
context.beginPath();
//center
context.moveTo(400,250);
context.lineTo(400,455);
context.lineWidth = 2;
context.lineCap = 'round';
context.strokeStyle = 'black';
context.stroke();
//center, right
context.moveTo(400,455);
context.lineTo(440,222);
context.lineWidth = 2;
context.strokeStyle = 'black';
context.stroke();
//far right
context.moveTo(400,455);
context.lineTo(550,240);
context.lineWidth = 2;
context.strokeStyle = 'black';
context.stroke();
//mid right
context.moveTo(400,455);
context.lineTo(500,193);
context.lineWidth = 2;
context.strokeStyle = 'black';
context.stroke();
//mid left
context.moveTo(400,455);
context.lineTo(300,193);
context.lineWidth = 2;
context.strokeStyle = 'black';
context.stroke();
//center, left
context.moveTo(400,455);
context.lineTo(360,222);
context.lineWidth = 2;
context.strokeStyle = 'black';
context.stroke();
//far left
context.moveTo(400,455);
context.lineTo(250,240);
context.lineWidth = 2;
context.strokeStyle = 'black';
context.stroke();




////////////////////////////////////// end above this line ààààààààààààààà

};

</script>
</head>
<body>
<canvas id="myCanvas" width="800" height="600"></canvas>
</body>
</html>