Embedding images from a SharePoint site in an Outlook email

Including an image as part of the body of an email is not as straight forward as you might like when you’re dealing with Power Automate. Including the image as an attachment to an email is an easy workaround, but, if you’re like me, I don’t like seeing the attachment icon next to my email message in my inbox if there’s not really an attachment. Follow the steps in this post if you have an image that you have used in your SharePoint Online site and want to include the image in the email content.

Firstly, you need to upload your image to a site in SharePoint Online. The most common place for images is the Site Assets library, but any document library will suffice. Once you have uploaded your image, go to Power Automate and start your flow the way you want (either by a manual trigger or some other automated trigger).

Next you will need to add the Get file content using path SharePoint action. On the File Path field, navigate to the location of the image that you uploaded previously.

Now we need to initialize a variable in our flow. This string variable will be used to configure the image HTML element. However, we will configure the element to use the Base64 data of the image, instead of pointing to the SharePoint URL of the image location. Base64 is an encoded ASCII representation of the image.

The content type is image slash the file extension (e.g. image/png, image/jpg, etc.). To extract it from the Get file content using path action, use body(‘Get_file_content_using_path’)[‘$content-type’].

To extract the base 64 code from the Get file content using path action, use body(‘Get_file_content_using_path’)[‘$content’].

<img src="data:body('Get_file_content_using_path')['$content-type'];base64,body('Get_file_content_using_path')['$content']" alt="Logo" />

Once we have initialized our variable, we can now add it to a Send an email action. Make sure you press the Code View button in the Body before you write the Body of your email.

You can add additional HTML around your variable, such as headings, tables, list etc.

You can add as many images as you wish. However, you will have to get the content via the Get file content using path action for each image.