GPU | Universal Shading (USL) WebGPU samples GitHub ↗
Orange triangle rendered by the first pixel sample
Render / 01

First pixel

A bufferless triangle through the portable render path.

Four-color texture rendered by the texture path sample
Transfer + Binding / 02

Transfer chain

All four copy directions execute; the texture-to-texture result is then bound and sampled.

Gradient triangle rendered by the compute handoff sample
Compute / 03

Compute handoff

Per-dispatch constants animate a compute-generated vertex stream.

Indexed cube and depth preview
Render / 04

Indexed depth

Indexed depth, occlusion resolve, barriers, and a query-tinted depth preview.

Eight colored triangle instances
Render / 05

Instancing

Instance-rate vertices and reflected dynamic uniform offsets.

Compute-generated storage texture gradient
Compute / 07

Storage texture

Compute writes typed RGBA8 pixels; render samples them directly.

Green triangle rendered with push constants
Render / 08

Push constants

Per-draw constants with native lowering and WebGPU dynamic slices.

Antialiased gradient triangle
Render / 09

MSAA resolve

Four-sample rasterization resolved directly into the swapchain.

Red and blue circles composited from multiple render targets
Render / 10

MRT blend

Two color targets use independent alpha and additive blending.

Dark comparison shadow over an orange background
Binding / 11

Comparison shadow

Depth comparison sampling and filtered shadow visibility.

Two-dimensional checker layers above compute-copied one-dimensional color layers
Binding / 12

Texture array

Compute reads, queries, and writes logical 1D-array layers before render samples them.

Uploaded one-dimensional color bands above compute-transformed bands
Binding / 13

Texture line

Compute transforms a logical 1D texture before render reads both lines.

Cubemap panorama beside a sampled 3D color volume
Binding / 14

Texture shapes

Cubemap faces and a 3D volume share one reflected bind group.

Four checker textures selected through dynamic descriptor indices
Binding / 15

Descriptor arrays

Dynamic texture, sampler, and buffer indices flatten into bounded WebGPU bindings.

Compute-generated triangle colored through a native subgroup shuffle
Compute / 17

Subgroup exchange

A native subgroup shuffle colors a compute-generated vertex stream.

Compute-generated triangle colored with half-precision arithmetic
Compute / 18

Half precision

Native f16 arithmetic, with a bounded f32 fallback.

Two triangles produced from one multi-draw batch
Render / 19

Multi-draw batch

One API call consumes two packed indirect draw records.

Compute-generated triangle launched from an indirect dispatch record
Compute / 20

Indirect dispatch

One packed dispatch record launches the compute-to-render path.

Compute-generated triangle colored after resolving compute and render pass timestamps
Compute / 21

Pass timestamps

Pass timestamps validate portable 8-byte resolve alignment.

Colorful compute particles moving over a dark background
Compute / 22

Compute particles

Compute updates a persistent particle field consumed directly by render.

Five panels sampling distinct colored texture mip levels
Binding / 23

Mip chain + LOD

One uploaded mip chain is sampled at five explicit levels.

Cyan rectangle surrounded by an orange stencil outline
Render / 24

Stencil outline

A fill pass writes stencil, then a larger draw keeps only the visible outline.

Cyan, orange, and yellow shapes surrounded by a compute-generated glow
Compute / 25

Separable bloom

Horizontal and vertical compute passes feed one sampled composite.

Texture-coordinate reference image sampled on a centered quad
Binding / 26

Image texture

Browser-decoded sRGB pixels are uploaded once and sampled through reflected bindings.

Four integer cubemap panels using nearest, LOD, gradient, and bias sampling
Binding / 27

Integer cubemap

Typed cube sampling lowers to a bounded WebGPU array-view fallback.

The same color texture interpreted as sRGB and linear, then tone mapped from HDR
Render / 28

Color pipeline

Left decodes sRGB; right treats the same bytes as linear before HDR tone mapping.

A compressed color texture selected from ASTC, BC, ETC2, or RGBA8
Binding / 29

Compressed texture

Capability selection prefers native compression and keeps RGBA8 as the portable fallback.

A four-bone animated ribbon deformed by GPU skinning
Render / 30

GPU skinning

Four bone matrices animate an indexed mesh through a reflected dynamic uniform ring.

A rotating PBR sphere lit by albedo, tangent normals, metallic-roughness, and a cubemap
Render / 31

PBR material

Albedo, tangent normals, metallic-roughness, and cubemap lighting share one reflected layout.

Source texture, nearest blit, and linear blit shown from left to right
Blit / 33

Texture blit

Magnified 32x32 source at left; nearest and linear 256x256 blits at center and right.