HDR in custom shader looks different compared to MeshStandardMaterial

[Martinusius]

I am trying to use an HDR cube texture in a custom shader (ShaderMaterial). However when I try that it looks different to how it looks in MeshStandardMaterial (specifically this example three.js examples).

This is how it should look like (MeshStandardMaterial):

This is how it looks like in my shader:

I already added the RGBEToLinear function to my shader to convert the HDR to linear color. The HDR texture seems to have an encoding value of 3002 which should be RGBE.

Is there another operation I should apply to the color to make it the same as it is in MeshStandardMaterial? What steps does MeshStandardMaterial use to sample the HDR correctly?

The way I am currently sending the texture to my shader is simply by setting the samplerCube uniform to the cube texture. Are any other steps necessary or is this fine?

Thanks for any kind of help.

[Mugen87]

Have you already added tone mapping to your custom material? Without it, a HDR workflow is incomplete.

[Martinusius]

Yes, that seems to be it. After applying tone mapping the colors seem to be correct. The only difference is that the HDR is a lot darker. I multiplied the resulting color by PI (I’ve seen that being done in the standard material shader code). I don’t know why this is done but now the images look very similar.

MeshStandardMaterial:

My custom shader: