MailViewr - Free HTML Email Preview Tool
← CSS Support Index

Does CSS border-radius Work in HTML Email?

The `border-radius` CSS property rounds the corners of an element's outer border edge.

Quick Answer

Does border-radius work in HTML email?

The CSS border-radius property is supported in Gmail, Outlook (Mac / Web), Apple Mail, Samsung Email, and others. It is NOT supported in Outlook (Windows). Always include a safe fallback for unsupported clients.

Which Email Clients Support CSS border-radius?

CSS support for border-radius across email clients

Email ClientDesktopMobile / WebNotes
Gmail✓ Yes✓ Yes
Outlook (Windows)✗ No?
Outlook (Mac / Web)✓ Yes✓ Yes
Apple Mail✓ Yes✓ Yes
Yahoo! Mail~ Partial~ Partial
Samsung Email?✓ Yes
Thunderbird✓ Yes?
ProtonMail✓ Yes✓ Yes
Fastmail✓ Yes?

Notes

  • #1 Round corners can be used in VML with the `RoundRect` element. See [buttons.cm](https://buttons.cm/) and [VML documentation](https://docs.microsoft.com/en-us/windows/win32/vml/msdn-online-vml-roundrect-element).
  • #2 Partial support. Shorthand for setting elliptical borders with the slash `/` notation is not supported e.g. `border-radius: 27% 73% 70% 30% / 30% 34% 66% 70%;`.

Frequently Asked Questions

Related CSS Properties

Test Your Email Now

Paste your HTML and see how it renders in clients that don't support
border-radius.

Open Email Previewer