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 the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.