Overwrite opaque pixels with transparent ones when compositing
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 32.7k
- Forks
- 1.4k
- Avg merge
- 1d 14h
- Merged PRs (30d)
- 5
Description
## 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
```js
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):

Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the standalone JavaScript example using composite and review the related discussion in issue #1016. Determine whether the existing compositing behavior can meet the requested cutout result or whether a new capability is needed; done means the center becomes transparent without requiring a separate mask image.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, nodejs
- Domain
- computer-graphics
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100