How to add a drop shadow to an image in Node.JS

A great way to add visual interest to an image is with proper use of a drop shadow, helping the photo “pop” so to speak. You could manually do this in an image editing program pretty quickly, of course, but that’s not practical if you are dealing with any sort of volume, like on a photo website, for example. You could also code out a solution from scratch in Node.JS, which will also take a while. The final option, which I am about to demonstrate, is super simple and takes a fraction of the time of the other methods. Let’s dive in.

Begin by installing our API client with this command:

npm install cloudmersive-image-api-client --save

Now just call the drop shadow function:

var CloudmersiveImageApiClient = require('cloudmersive-image-api-client');var defaultClient = CloudmersiveImageApiClient.ApiClient.instance;// Configure API key authorization: Apikeyvar Apikey = defaultClient.authentications['Apikey'];Apikey.apiKey = 'YOUR API KEY';// Uncomment the following line to set a prefix for the API key, e.g. "Token" (defaults to null)//Apikey.apiKeyPrefix = 'Token';var apiInstance = new CloudmersiveImageApiClient.EditApi();var X = 56; // Number | Horizontal (X) offset of the drop shadowvar Y = 56; // Number | Vertical (Y) offset of the drop shadowvar sigma = 56; // Number | Sigma (blur distance) of the drop shadowvar opacity = 56; // Number | Opacity of the drop shadow; 0 is 0% and 100 is 100%var imageFile = "/path/to/file"; // File | Image file to perform the operation on.  Common file formats such as PNG, JPEG are supported.var callback = function(error, data, response) {if (error) {console.error(error);} else {console.log('API called successfully. Returned data: ' + data);}};apiInstance.editDropShadow(X, Y, sigma, opacity, imageFile, callback);

Here is an example image run through the function with an offset of 25, sigma of 10, and opacity of 75.

Image for post
Image for post

Written by

There’s an API for that. Cloudmersive is a leader in Highly Scalable Cloud APIs.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store