power automatehtmlemailpreviewbrowser extensionmicrosoftpower platformchrome extension

Power Automate HTML Preview: See Your Email HTML Before It Sends

Sending HTML emails from Power Automate without previewing them is risky. The HTML Preview browser extension lets you see exactly how your email body will render, directly inside the flow designer.

6 min read
Free Chrome Extension

HTML Preview

Add this free extension to Chrome and use it directly inside Power Automate — no separate tab needed.

Add to Chrome — Free

Power Automate is widely used to send automated emails. Approval notifications, status updates, weekly summaries, alert messages: flows send thousands of HTML emails every day. The problem is that the flow designer gives you a plain text input for the email body. You type or paste HTML directly into an action input field, with no preview of how it will actually look.

The Power Automate HTML Preview extension solves that by rendering your HTML in a sandboxed panel directly inside the designer, so you can see exactly what the recipient will receive before you save the flow.

Why Previewing HTML Matters

Email HTML is not the same as HTML on the web. Email clients each render HTML slightly differently. Microsoft Outlook, Gmail, Apple Mail, and Outlook on the web all handle CSS and HTML features with varying levels of support. What looks perfect in a browser might have broken layout, missing images, or unstyled text in an email client.

Beyond cross-client compatibility, common mistakes in Power Automate email HTML include:

Missing or broken dynamic content

When you build an HTML email body in Power Automate, you insert dynamic content references like the approval requester's name, the item title, or a due date. If those references are incorrectly formatted, they appear as raw expression syntax in the sent email instead of the actual values.

Inline style errors

Email HTML relies heavily on inline styles because many clients strip <head> style blocks. CSS classes, external stylesheets, and media queries are commonly ignored. If you write HTML using class-based styling, the email may render unstyled.

Table layout problems

HTML emails commonly use table-based layouts for compatibility. Incorrect colspan, missing border-collapse, and inconsistent table cell widths cause layout breaks that are invisible in a code editor but obvious when rendered.

Encoding issues

Special characters like quotation marks, ampersands, and non-ASCII characters need to be HTML-encoded in email bodies. Raw characters sometimes pass through incorrectly, resulting in garbled text.

How the HTML Preview Extension Works

The HTML Preview extension adds a preview trigger to the Power Automate cloud flow designer. When you are editing an email action — Send an email, Send an email notification, or any other connector that takes an HTML body — the extension detects the active input field.

When you click the preview button, the extension reads the content of the email body field and renders it in a sandboxed panel in the browser side panel.

Sandboxed Rendering

The HTML is rendered inside a sandboxed iframe with JavaScript disabled and external resource loading blocked. This means the preview shows you the HTML as an email client would see it, without executing any scripts or loading remote images that might trigger tracking.

Unsafe Tag Removal

The extension strips unsafe HTML elements before rendering: <script>, <object>, <embed>, and event handler attributes like onclick are removed. The preview shows only the visual content.

Dynamic Content Placeholders

When your HTML body contains Power Automate dynamic content references (the blue tokens that appear in action inputs), these references cannot be resolved at design time. The extension replaces them with clearly labelled placeholders, so you can see where dynamic values will appear in the rendered email.

Multiple Preview Sizes

You can preview the HTML at different viewport widths to simulate how it renders on desktop and mobile email clients. This is useful for checking that a table-based layout does not overflow on narrow screens.

Practical Use Cases

Building a new HTML email template

Paste your HTML into the email body field. Open the preview. See exactly how it renders. Adjust styles, fix layout issues, and re-preview without needing to trigger a test run of the flow and receive the email.

Reviewing an inherited flow's email template

When you take ownership of a flow that sends formatted emails, the HTML Preview extension gives you an instant visual of what those emails look like without sending a test email.

Troubleshooting a reported email formatting issue

When a user reports that an email from a flow looks wrong, open the flow's send email action and use the HTML Preview to see if the template itself is the problem, before looking at whether the issue is connector-side or client-side.

What the Extension Does Not Do

The HTML Preview extension renders HTML for visual inspection. It does not simulate email client-specific rendering quirks. For comprehensive cross-client testing, a dedicated email testing tool is appropriate. The extension's value is in fast, in-designer preview during flow development, not in final pre-send verification.

Privacy

The extension reads only the content of the selected email body input field when you explicitly trigger the preview. No data is sent to any external server. The rendering happens entirely in a local sandboxed iframe in your browser.

Installation

Install Power Automate HTML Preview from the Chrome Web Store. It also works in Microsoft Edge. Open any Power Automate flow that contains an email action. Click into the email body input and the preview button appears. Click it to open the rendered preview in the browser side panel.

Knowing what your HTML emails actually look like before they reach recipients takes thirty seconds with HTML Preview. Missing that step can mean hundreds of users receiving a broken email template.