Secure context
This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

When using the XRWebGLLayer() constructor to create a new WebGL rendering layer for WebXR, providing as the layerInit parameter an object whose stencil property is false requests that the new layer be created without a stencil buffer.

The stencil buffer is an optional buffer which, just like the depth buffer, contains one entry for every pixel in the frame buffer. Also just like the depth buffer, the value of an enter in the stencil buffer directly affects how (or if) the corresponding pixel is drawn during rendering. You can store values into each entry in the stencil bufer, then specify an operation that determines which stencil buffer values correspond to pixels which should be drawn to the screen during each frame.


let layerInit = {
  stencil: false
let glLayer = new XRWebGLLayer(xrSession, gl, layerInit);

let glLayer = new XRWebGLLayer(xrSession, gl, { stencil: false });


A Boolean which can be set to false to specify that the new WebGL layer should not include a stencil buffer. The default value is true.


In this example, a new XRWebGLLayer is created for a WebXR session, xrSession, without a stencil buffer.

  baseLayer: new XRWebGLLayer(xrSession, gl, {
     stencil: false


Specification Status Comment
WebXR Device API
The definition of 'XRWebGLLayerInit.stencil' in that specification.
Working Draft Initial definition.

Browser compatibility

ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
stencilChrome Full support 79Edge Full support 79Firefox No support NoIE No support NoOpera No support NoSafari No support NoWebView Android Full support 79Chrome Android Full support 79Firefox Android No support NoOpera Android No support NoSafari iOS No support NoSamsung Internet Android Full support 11.2


Full support
Full support
No support
No support

See also