Transparant texture above vertex colors does not work

Questions
1

Hi, I have a transparant grass texture and want to render that above the vertex colors of a planegeometry.

				const generatedTexture = new THREE.TextureLoader().load('gress.png')
				rs = new THREE.MeshLambertMaterial({
					transparent: true,
					vertexColors : THREE.VertexColors,
				});

if i disable transparant it is the first picture, but with transparancy enabled, the colors are gone. How to do this?

Screenshot 2022-01-09 at 12.46.39
Screenshot 2022-01-09 at 12.46.391113×528 230 KB

texture:

gress
gress512×512 192 KB

3

So what I want is the green background color (of the first picture = vertex colors), and then the original transparant picture on top of that

4

Can you please demonstrate your setup with a live example? Edit fiddle - JSFiddle - Code Playground

5

@Mugen87 I can’t make it because I don’t know, but this look at this fiddle:
Instead of the green background right now, i want a custom color (eg red) and then have my green transparant grass above it. So it should be red where the grass image is transparant and then the original color of the grass where it is not… I mean this is pretty basic no?

basically i want something like 2 layers on the planegeometry: background color layer and then transparant grass layer on top

6

vertex color and diffuse color are just multiplied together. So this isn’t about transparency. Turn off transparent and just give the grass texture a white background.

7

SOLVED: After some help, I figured I had to modify an existing material with the onBeforeCompile and blend the colors