Text with Gradients and Patterns
We’ve already explored the fillColor
and strokeColor
properties of the
Canvas context by setting those values to CSS-compliant colors. However,
those very same properties can be
set to refer to a few other objects defined in the Canvas API to create
some stunning text effects. The objects are:
- Linear gradient
A linear color gradient with two or more colors
- Radial gradient
A circular color gradient with two or more colors
- Image pattern
An
Image
object used as a fill pattern
Get HTML5 Canvas, 2nd Edition now with O’Reilly online learning.
O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.