Composite image(s) over the processed (resized, extracted etc.) image.
The images to composite must be the same size or smaller than the processed image.
If both top
and left
options are provided, they take precedence over gravity
.
The blend
option can be one of clear
, source
, over
, in
, out
, atop
,
dest
, dest-over
, dest-in
, dest-out
, dest-atop
,
xor
, add
, saturate
, multiply
, screen
, overlay
, darken
, lighten
,
colour-dodge
, color-dodge
, colour-burn
,color-burn
,
hard-light
, soft-light
, difference
, exclusion
.
More information about blend modes can be found at https://libvips.github.io/libvips/API/current/libvips-conversion.html#VipsBlendMode and https://www.cairographics.org/operators/
-
images
Array<Object> Ordered list of images to composite-
images[].input
(Buffer | String)? Buffer containing image data, String containing the path to an image file, or Create object (see below)-
images[].input.create
Object? describes a blank overlay to be created.
-
-
images[].blend
String how to blend this image with the image below. (optional, default'over'
) -
images[].gravity
String gravity at which to place the overlay. (optional, default'centre'
) -
images[].top
Number? the pixel offset from the top edge. -
images[].left
Number? the pixel offset from the left edge. -
images[].tile
Boolean set to true to repeat the overlay image across the entire image with the givengravity
. (optional, defaultfalse
) -
images[].premultiplied
Boolean set to true to avoid premultipling the image below. Equivalent to the--premultiplied
vips option. (optional, defaultfalse
) -
images[].density
Number number representing the DPI for vector overlay image. (optional, default72
) -
images[].raw
Object? describes overlay when using raw pixel data. -
images[].animated
boolean Set totrue
to read all frames/pages of an animated image. (optional, defaultfalse
) -
images[].failOn
string @see constructor parameters (optional, default'warning'
) -
images[].limitInputPixels
(number | boolean) @see constructor parameters (optional, default268402689
)
-
await sharp(background)
.composite([
{ input: layer1, gravity: 'northwest' },
{ input: layer2, gravity: 'southeast' },
])
.toFile('combined.png');
const output = await sharp('input.gif', { animated: true })
.composite([
{ input: 'overlay.png', tile: true, blend: 'saturate' }
])
.toBuffer();
sharp('input.png')
.rotate(180)
.resize(300)
.flatten( { background: '#ff6600' } )
.composite([{ input: 'overlay.png', gravity: 'southeast' }])
.sharpen()
.withMetadata()
.webp( { quality: 90 } )
.toBuffer()
.then(function(outputBuffer) {
// outputBuffer contains upside down, 300px wide, alpha channel flattened
// onto orange background, composited with overlay.png with SE gravity,
// sharpened, with metadata, 90% quality WebP image data. Phew!
});
- Throws Error Invalid parameters
Returns Sharp
Meta
- since: 0.22.0