Custom Transform

Custom Transform

Basic

Apply custom transformation matrices to shapes

View Code & Preview
Direct Update

Direct Update

Basic

Direct shape updates with retained properties

View Code & Preview
Fill Rule

Fill Rule

Basic

Demonstrate shape fill rules

View Code & Preview
Fill Spread

Fill Spread

Basic

Demonstrate gradient spread modes: pad, reflect, and repeat

View Code & Preview
Gradient Stroke

Gradient Stroke

Basic

Apply linear and radial gradients to strokes

View Code & Preview
Gradient with Transforms

Gradient with Transforms

Basic

Animate gradients with shape transformations

View Code & Preview
Linear Gradient

Linear Gradient

Basic

Apply linear and radial gradients to shapes

View Code & Preview
Image Rotation

Image Rotation

Basic

Rotate images around center origin

View Code & Preview
Image Scaling

Image Scaling

Basic

Scale images around center origin

View Code & Preview
Opacity

Opacity

Basic

Demonstrate opacity control on shapes and scenes

View Code & Preview
Path Drawing

Path Drawing

Basic

Draw shapes using path commands

View Code & Preview
Radial Gradient

Radial Gradient

Basic

Demonstrate radial gradients

View Code & Preview
Scene Blending

Scene Blending

Basic

Demonstrate scene blending modes

View Code & Preview
Scene Transform

Scene Transform

Basic

Animate scene transformations with rotate, scale, and translate

View Code & Preview
Shapes

Shapes

Basic

Draw simple shapes

View Code & Preview
Stroke Line

Stroke Line

Basic

Demonstrate stroke join and cap styles

View Code & Preview
Stroke Miter Limit

Stroke Miter Limit

Basic

Demonstrate stroke miter limit behavior

View Code & Preview
Stroke

Stroke

Basic

Demonstrate stroke width, join, and cap styles

View Code & Preview
Shape Transform

Shape Transform

Basic

Animate shapes with rotation and scaling

View Code & Preview
Path Trimming

Path Trimming

Basic

Trim paths to show only portions of shapes

View Code & Preview
Blending

Blending

Advanced

Demonstrate all blend modes with various paint types

View Code & Preview
Bounding Box

Bounding Box

Advanced

Display bounding boxes around objects

View Code & Preview
Clipping

Clipping

Advanced

Demonstrate clipping for shapes and scenes

View Code & Preview
Duplication

Duplication

Advanced

Duplicate shapes, scenes, pictures, and objects

View Code & Preview
Effect Drop Shadow

Effect Drop Shadow

Advanced

Drop shadow effect applied to scene content

View Code & Preview
Error Handling

Error Handling

Advanced

Global error handler catches

View Code & Preview
Gradient Masking

Gradient Masking

Advanced

Demonstrate Alpha and InvAlpha masking with linear gradients

View Code & Preview
Intersects

Intersects

Advanced

Interactive example demonstrating paint.intersects() API with mouse hover detection

View Code & Preview
Masking

Masking

Advanced

Demonstrate Alpha, InvAlpha, Luma, and InvLuma masking with various paint types

View Code & Preview
Masking Methods

Masking Methods

Advanced

Demonstrate all 6 mask composition methods (Add, Subtract, Intersect, Difference, Lighten, Darken)

View Code & Preview
Scene Effects

Scene Effects

Advanced

Comprehensive demonstration of all scene effects: Gaussian Blur, Fill, Tint, and Tritone

View Code & Preview
Viewport

Viewport

Advanced

Control canvas viewport for panning effects

View Code & Preview
Text Effects

Text Effects

Text

Demonstrate text animation with multiple effects

View Code & Preview
Text Layout

Text Layout

Text

Demonstrate text layout with alignment within a bounding box

View Code & Preview
Text Line Wrap

Text Line Wrap

Text

Demonstrate text wrapping modes with different alignments

View Code & Preview
Text

Text

Text

Demonstrate basic text features

View Code & Preview
JPG

JPG

Media

Load and display JPG images

View Code & Preview
Lottie

Lottie

Media

Load and play a Lottie animation with playback controls

View Code & Preview
Lottie Expressions

Lottie Expressions

Media

Lottie animations with expressions support

View Code & Preview
PNG

PNG

Media

Load and display PNG images

View Code & Preview
Raw

Raw

Media

Load and display raw ARGB8888 image data

View Code & Preview
SVG

SVG

Media

Load and display the Ghostscript Tiger SVG

View Code & Preview
WebP

WebP

Media

Load and display WebP images

View Code & Preview