This feature is not Baseline because it does not work in some of the most widely-used browsers.
The EXT_frag_depth extension is part of the WebGL API and enables to set a depth value of a fragment from within the fragment shader.
WebGL extensions are available using the WebGLRenderingContext.getExtension() method. For more information, see also Using Extensions in the WebGL tutorial.
Note: This extension is only available to WebGL1 contexts. In WebGL2, the functionality of this extension is available on the WebGL2 context by default. It requires GLSL #version 300 es.
Enable the extension:
gl.getExtension("EXT_frag_depth");
Now the output variable gl_FragDepthEXT is available to set a depth value of a fragment from within the fragment shader:
<script type="x-shader/x-fragment">
void main() {
gl_FragColor = vec4(1.0, 0.0, 1.0, 1.0);
gl_FragDepthEXT = 0.5;
}
</script>
| Desktop | Mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | WebView Android | WebView on iOS | |
EXT_frag_depth |
38 | 9317–79 | 47 | 25 | 9 | 38 | No | 25 | 15 | 3.0 | 38 | 15 |
© 2005–2025 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/EXT_frag_depth