White image is getting grey edges when rendered

[ivan-i1]

White image is getting grey edges when rendered

I first noticed this grey-edge thing when using a white materials on custom meshes. I was blaming the geometries but then I tried to render a white image in the most straight-forward way I know without any special meshes and I got the grey edges. I also tried rendering a full opacity image (no antialias or anything else) and that one also got the grey edges. Is this known issue?

Below the white PNG image I used for testing.

Here a screenshot of the codepen with the snowflake being rendered on a white background.
(Please note how the grey edges make the snowflake visible)

• codepen (release branch 87)

Three.js version

• 87

Browser

• Chrome
• Firefox
• Safari

OS

• macOS

[WestLangley]

Please do not cross-post stackoverflow help question here.

You can try the forum if you want.

[ivan-i1]

Ok, let me rephrase and sorry in advance if I seem stubborn.

I have a perfectly white image.
Using the last ThreeJS release (95) and the 87 version for the example only (no additional libraries or anything).
I render this image using only ThreeJS in the path:
Image->Texture->Material->Render
The render has white background.

So there is no reason for other than white pixels to appear.
But they do.

I'm claiming here that this is a bug, are you already aware of it?

[mrdoob]

Can you please post this in the forum instead?

[WestLangley]

Mipmapping is most likely the cause of your issue.

You can turn off mipmapping:

texture.generateMipmaps = false;
texture.magFilter = THREE.LinearFilter;
texture.minFilter = THREE.LinearFilter;

Alternatively, you can premultiply alpha on upload to the GPU, but that requires that you specify a custom blending function. Assuming you still want normal alpha blending, you would do this:

texture.premultiplyAlpha = true;

material = new THREE.MeshBasicMaterial( {
    map: texture,

    blending: THREE.CustomBlending,
    blendEquation: THREE.AddEquation,
    blendSrc: THREE.OneFactor,
    blendDst: THREE.OneMinusSrcAlphaFactor,
    blendSrcAlpha: THREE.OneFactor,
    blendDstAlpha: THREE.OneMinusSrcAlphaFactor,

    transparent: true
} );

See https://developer.nvidia.com/content/alpha-blending-pre-or-not-pre.