Include an Image in an Exported Excel File

Updated on Sep 28, 2026

Environment

Product	Progress® Kendo UI® for Angular Excel Export

Description

How can I include an image in an exported Excel file?

This KB also answers the following questions:

• How do I add a logo to an Excel Export workbook?
• How can I position an image on an exported worksheet?
• How do I add browser-loaded image data to Excel workbook options?

Solution

Load the image in the browser, get workbook settings with workbookOptions, and add the binary image to the workbook images collection. Add a drawing that references the image ID and sets its cell position and dimensions before you call save.

The following example adds a logo to the exported inventory workbook.

Example

View Source

Loading ...

To include the image:

1. Add a template reference variable to the kendo-excelexport component and query its ExcelExportComponent instance with ViewChild.

   html

   <kendo-excelexport #excelExport [data]="products" fileName="inventory.xlsx">
     <kendo-excelexport-column field="name" title="Product"></kendo-excelexport-column>
   </kendo-excelexport>

2. Fetch the image, confirm that the response succeeds, and convert it to an ArrayBuffer. Then add the binary image and a drawing to the workbook before you save it.

   ts

   const workbook = this.excelExport.workbookOptions() as ImageWorkbookOptions;
   workbook.images = { logo: { data: await response.arrayBuffer(), type: 'image/png' } };
   workbook.sheets[0].drawings = [{ image: 'logo', topLeftCell: 'D2', width: 96, height: 96 }];
   this.excelExport.save(workbook);

See Also

• Excel Export Overview