sharp
sharp copied to clipboard
Overwrite opaque pixels with transparent ones when compositing
Question about an existing feature
What are you trying to achieve?
I want to place an image with transparency on top of another, but cut through the original image so it is still fully transparent. I looked through the blend modes and I couldn't figure out how to do this without creating another image to use as a mask.
When you searched for similar issues, what did you find that might be related?
This was somewhat related, but I couldn't find any cutout method in the current version: https://github.com/lovell/sharp/issues/1016
Please provide a minimal, standalone code sample, without other dependencies, that demonstrates this question
const a = await sharp("A.png").toBuffer();
const b = await sharp("B.png").toBuffer();
const c = await sharp(b)
.composite([{ input: a, left: 0, top: 0 }])
.toFile("C.png");
Please provide sample image(s) that help explain this question
A:
B:
A and B combined (I want the center to be transparent like this):
Did you see the dest-in blend? This can be used to "cut out" one image from another.
await sharp("B.png")
.composite([{ input: "A.png", left: 0, top: 0, blend: "dest-in" }])
.toFile("C.png");
Yes, but I don't think that will help
This is what the result is: