Canvas API
Draw graphics, create animations, manipulate images, and render real-time visualizations using the HTML5 Canvas API. Perfect for games, data visualization, and creative graphics.
Basic Shapes
This example shows how to draw colorful shapes like rectangles, circles, and triangles on a canvas, creating the building blocks for more complex graphics.
Output
Click Run to see output...Animation
This example creates a bouncing, color-changing circle that moves smoothly across the screen, demonstrating how to build engaging animations with canvas.
Output
Click Run to see output...Image Manipulation
This example shows how to apply custom filters to images by changing their pixels directly, similar to photo editing apps but running right in your browser.
Output
Click Run to see output...3D Graphics (WebGL)
This example creates a rotating 3D cube with lighting effects, showing how canvas can be used for powerful 3D graphics and games through WebGL.
Output
Click Run to see output...