WebGLRenderingContext: unpackColorSpace property

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Note: This feature is available in Web Workers.

The WebGLRenderingContext.unpackColorSpace property specifies the color space to convert to when importing textures. Along with the default (srgb), the display-p3 color space can be used.

Texture image sources can be the following:

Textures are imported using the WebGLRenderingContext.texImage2D() and WebGLRenderingContext.texSubImage2D() methods and conversion to the specified unpackColorSpace color space happens during import.

Note that this doesn't apply to HTMLImageElement when the UNPACK_COLORSPACE_CONVERSION_WEBGL pixel storage parameter is set to NONE.

Value

This property can have the following values:

If an invalid value is specified, then the value of unpackColorSpace will remain unchanged.

Examples

Converting sRGB ImageData to display-p3 in a texture

js
const canvas = document.getElementById("canvas");
const gl = canvas.getContext("webgl");

gl.drawingBufferColorSpace = "display-p3";
gl.unpackColorSpace = "display-p3";

// Some sRGB ImageData
// Will be converted from sRGB to Display P3
const imageData = new ImageData(data, 32, 32);

const tex = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, tex);
gl.texImage2D(
  gl.TEXTURE_2D,
  0,
  gl.RGBA,
  width,
  height,
  0,
  gl.RGBA,
  gl.UNSIGNED_BYTE,
  imageData,
);

Specifications

Specification
WebGL Specification
# DOM-WebGLRenderingContext-unpackColorSpace

Browser compatibility

BCD tables only load in the browser

See also