How to get an sRGB drawing buffer?

Mark Callow

unread,

Jul 20, 2019, 5:11:46 PM7/20/19

to WebGL Dev List

Is there any way to get an sRGB drawing buffer in WebGL? There is no context attribute for it and, looking at the results, it looks like the default drawing buffer is linear.

Regards

-Mark

signature.asc

Ken Russell

unread,

Jul 20, 2019, 5:47:32 PM7/20/19

to WebGL Dev List, Fernando Serboncini

Control over canvas elements' color spaces is still under development. CC'ing fserb@ who is the TL for the Canvas element in Chrome.

I recommend you use WebGL 2.0 or the EXT_sRGB extension from WebGL 1.0 and allocate your own framebuffer with SRGB8 or SRGB8_ALPHA8 format, then blitFramebuffer to the default back buffer at the end of the frame.

There's some code in Chrome for supporting the colorSpace context creation attribute:

https://github.com/WICG/canvas-color-space/blob/master/CanvasColorSpaceProposal.md (still being debated by browser vendors)

https://cs.chromium.org/chromium/src/third_party/blink/renderer/modules/canvas/htmlcanvas/canvas_context_creation_attributes_module.idl (shows the colorSpace and pixelFormat context creation attributes)

https://cs.chromium.org/chromium/src/third_party/blink/renderer/core/html/canvas/image_data_color_settings.idl?q=CanvasColorSpace&l=8&dr=C (shows the accepted colorSpace values)

The way to get access to these features is to launch Chrome from the command line with the argument --enable-features=CanvasColorManagement . Then you should be able to pass the context creation attribute:

"colorSpace": "linear-rgb"

but I think that's not being obeyed in Chrome's WebGL implementation right now.

-Ken

--
You received this message because you are subscribed to the Google Groups "WebGL Dev List" group.
To unsubscribe from this group and stop receiving emails from it, send an email to webgl-dev-lis...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/webgl-dev-list/98AEA25E-0045-49B3-9B57-95D8BF0E959F%40callow.im.

Mark Callow

unread,

Jul 22, 2019, 1:38:42 PM7/22/19

to WebGL Dev List, Fernando Serboncini

> On Jul 20, 2019, at 14:47, Ken Russell <k...@chromium.org> wrote:
>
> Control over canvas elements' color spaces is still under development. CC'ing fserb@ who is the TL for the Canvas element in Chrome.
>
> I recommend you use WebGL 2.0 or the EXT_sRGB extension from WebGL 1.0 and allocate your own framebuffer with SRGB8 or SRGB8_ALPHA8 format, then blitFramebuffer to the default back buffer at the end of the frame.

Thanks Ken. As far as I recall blitFramebuffer doesn’t do any conversion so what you are suggesting is blitting sRGB data into the drawing buffer, which means the drawing buffer isn’t really linear either. It if was the browser would be applying linear to sRGB conversion before composition which would totally mess up the blitted sRGB data. It’s only linear in that no conversion is done to the fragment shader outputs.

Regards

-Mark

signature.asc

Ken Russell

unread,

Jul 22, 2019, 5:05:53 PM7/22/19

to WebGL Dev List, Fernando Serboncini

OK, I see. Then maybe you should draw to an offscreen framebuffer and do a tone mapping pass, drawing to the canvas's internal back buffer, which applies the gamma curve you expect.

Unity demoed linear rendering a while back in https://blogs.unity3d.com/2017/07/17/linear-rendering-support-with-webgl-2-0/ but I think the main extension they were missing was sRGB DXT textures. Being able to specify the color space of the actual canvas is still a problem.

-Ken

Regards

-Mark

--
You received this message because you are subscribed to the Google Groups "WebGL Dev List" group.
To unsubscribe from this group and stop receiving emails from it, send an email to webgl-dev-lis...@googlegroups.com.

To view this discussion on the web visit https://groups.google.com/d/msgid/webgl-dev-list/F9820FB2-348A-4393-9B7B-19B38ACAB8AF%40callow.im.

Mark Callow

unread,

Jul 23, 2019, 1:34:45 PM7/23/19

to WebGL Dev List, Fernando Serboncini

On Jul 22, 2019, at 14:05, Ken Russell <k...@chromium.org> wrote:

OK, I see. Then maybe you should draw to an offscreen framebuffer and do a tone mapping pass, drawing to the canvas's internal back buffer, which applies the gamma curve you expect.

I’m not looking for a true linear FB at this point. I just want things drawn with sRGB textures to look correct. You first suggestion should do that as would doing a linear to sRGB encoding before writing gl_FragColor in my shaders.

Unity demoed linear rendering a while back in https://blogs.unity3d.com/2017/07/17/linear-rendering-support-with-webgl-2-0/ but I think the main extension they were missing was sRGB DXT textures.

Are there many machines that support DTX (BC1/3) textures but not the sRGB equivalents? I was surprised WebGL has separate extensions for them.

Regards

-Mark

signature.asc

Ken Russell

unread,

Jul 24, 2019, 5:33:45 PM7/24/19

to WebGL Dev List, Fernando Serboncini

The sRGB extensions were specified much, much later than the core DXT compressed texture format extensions. That's the reason they're separate.

-Ken

Regards

-Mark

--
You received this message because you are subscribed to the Google Groups "WebGL Dev List" group.
To unsubscribe from this group and stop receiving emails from it, send an email to webgl-dev-lis...@googlegroups.com.

To view this discussion on the web visit https://groups.google.com/d/msgid/webgl-dev-list/548F7542-B635-4E27-8C32-0B4324EC01CC%40callow.im.

Reply all

Reply to author

Forward