Skip to main content

Preserve the background transparency during export

This guide will show you how to preserve the background transparency if the user can load images in various formats.

The following explanation is only applicable if the exported image can be either a JPEG or PNG. PNG images can have significantly higher file size and could be unsuitable if you need to send the export image to a server.

The default image download needs to be disabled in the config since we use a separate download approach in the next step.

Listen for the export event which is emitted if the user clicks on the export button.

This code example uses a whitelist approach and will only export a PNG for certain image types.

The default export format will be set to image/jpg.

Since the user can upload their own images or select an image from the library tool we need to request the MIME type here with the getImageMimeType function.

The following image types could contain transparent backgrounds and will be exported as a PNG.

Calling the export function here with enableDownload: true will download the image in the desired format.

It is also possible to set enableDownload to false and return the promise result of the export function to a server.