Learn WebGPU
Basics: Your first triangle

Drawing a basic triangle

Render using a vertex shader and a fragment shader.

Learning steps

WebGPU uses shaders to run drawing logic on the GPU.

Main shader types:

  • Vertex shader — computes the position of each vertex.
  • Fragment shader — computes the color of each pixel.

WGSL (WebGPU Shading Language) A shading language designed for WebGPU with a Rust-like syntax.

Task

Define the triangle vertex positions in the vertex shader.

Progress 0 / 3 completed

WebGPUを初期化中...

コンソール
コンソール出力がここに表示されます

Learn WebGPU — interactive tutorials for learning WebGPU

GitHub