HTML5 Visual Effects: Procedural Graphics
Page 8
Free Visual Tools: Composites & Alpha
Learn with free visual tools for global composite operations and alpha transparency.
Select the global composite operation (GCO) from a menu.
Enter an alpha value between 1.0 and 0.5
in text boxes, for examples that include opacity.
Gradients
Global Composite Operations Tutorial Composite Operations & Alpha: Black Global Composite Options: JavaScript Source
What are Procedural Graphics?
Procedural graphics and textures use math and programming to prepare images, or video, with code and mathematics, alone. They often require less download and storage space. Most of all, procedural graphics offer nearly endless options for texture maps, tiles and special effects. The line with colorful gradations from red, to yellow, green, blue and violet, above, was originally prepared with HTML5 linear gradients.
HTML5 Visual Effects
This set of visual effects generated with HTML5 radial gradients includes beautiful animated colors with soft edges, animated drops of paint, raindrops, a sunburst, fire, a rainbow, particle explosions, rippling water, and more. Some examples apply HTML5 masks, alpha transparency and global composite operations.
Consider creative possibilities available with HTML5 radial and linear gradients, patterns, translucency, overlays, masks, and combinations!
