To add shadows with the HTML5 Canvas, we can use the shadowColor, shadowBlur, shadowOffsetX and shadowOffsetY properties of the canvas context.
Code Editor
Modified on April 9th, 2013
by Eric Rowell
- Tutorials
- Basics
- Advanced
- KineticJS
- Three.js
- Transformations
- Translate
- Scale
- Rotate
- Custom Transform
- Shear
- Mirror
- Reset Transform
- State Stack
- Oval
- Composites
- Shadows
- Global Alpha
- Clipping Region
- Operations
- Image Data & URLs
- Image Data
- Invert Colors
- Grayscale
- Get Data URL
- Load Data URL
- Save Drawing
- Animation
- Clear Canvas
- Animation Frames
- Linear Motion
- Acceleration
- Oscillation
- Start and Stop
- Mouse Detection
- Mouse Coordinates
HTML5 Canvas Shadow Tutorial
Tweet