Logo Pre-Work
GAMER CURIOUS COMPASSION AMBITIOUS FRIENDLY
Posts
Canvas Project
CREATED WITH CODE REFERENCE PHOTO This artwork is made of my own original design. I call her "Demon Girl." I made her using Adobe Dreamweaver. It is made entirely of code using quadratic curves, bezier curves, lines, and ellipses. Learning code was actually very enjoyable to me. It taught me to be very mindful of how to stack layers. <!doctype html> <html> <head> <meta charset="UTF-8"> <title> DEMON GIRL </title> <!-- import external .js scripts here --> <!-- <script type="text/javascript" src="#" ></script> --> <!-- modify CSS properties here --> <style type="text/css"> body,td,th { font-family: Monaco, "Courier New", "monospace"; font-size: 14px; color: rgba(255,255,255,1); } body { background-color: rgba(0,0,0,1); } #container { position: relative; text-align: left; width: 95%; height: 800px; } #fmxCanvas { position: relative; background-col
Gumball
var bg = ctx . createRadialGradient ( mouseX , mouseY , 50 , 287 , 260 , 300 ) bg . addColorStop ( 0 , "purple" ) bg . addColorStop ( 0.2 , "cyan" ) bg . addColorStop ( 0.4 , "lime" ) bg . addColorStop ( 0.6 , "red" ) bg . addColorStop ( 0.8 , "yellow" ) bg . addColorStop ( 1 , "magenta" ) //background ctx . beginPath (); ctx . rect ( 0 , 0 , canvas . width , canvas . height ) ctx . closePath (); ctx . fillStyle = bg ctx . fill (); //ears //ear 1 ctx . beginPath (); ctx . moveTo ( 357 , 44 ); ctx . bezierCurveTo ( 301 , 23 , 225 , 140 , 303 , 181 ); ctx . bezierCurveTo ( 398 , 184 , 410 , 63 , 357 , 44 ) ctx . closePath (); ctx . fillStyle = "rgba(91,193,207,1)" ctx . fill (); ctx . strokeStyle = "rgba(0,0,0,1)" ; ctx . lineWidth = 5 ; ctx . stroke (); //ear 2 ctx . beginPath (); ctx . moveTo ( 563 , 183 ); ctx . bezierCurveTo ( 524 , 118