gabrielperales/phoenix-email

PhoenixEmail is a library for building HTML emails inside Elixir applications that use the Phoenix web framework, and it is a direct port of a popular JavaScript project called react-email. Instead of hand writing the table based HTML and inline styles that email clients like Gmail, Outlook, and Apple Mail require, you write emails as ordinary Phoenix function components using the same HEEx templating syntax Phoenix developers already use for web pages, and PhoenixEmail turns them into the table layouts, inline styles, and Outlook specific workarounds that make an email render consistently across clients. The library ships a set of ready made components covering the pieces a typical email needs: a root email wrapper, a hidden preview text element for inbox previews, containers and sections for layout, headings, paragraphs, links, buttons, images, dividers, code blocks, and even a markdown renderer. Each component accepts a style attribute written either as a plain CSS string or as a map or keyword list, and property names can be written in snake case, camelCase, or kebab case, which makes it easy to copy styles over from an existing react-email project. Numbers are automatically given pixel units except for properties like line height or opacity where that would not make sense. There is also support for Tailwind CSS utility classes on any visual component. Rather than compiling Tailwind on every email render, a separate command scans your source code ahead of time, runs the real Tailwind compiler, and converts the resulting CSS into a lookup table of email safe inline styles, so rendering an email with Tailwind classes becomes a simple lookup instead of an extra build step per email. Both Tailwind version 3 and version 4 are supported, including newer Tailwind 4 features like oklch colors and CSS calc based spacing. Once a component is written, it can be rendered to an HTML string or to a plain text version for email clients that prefer it, and there is an optional integration with the Swoosh mailer library to send the rendered result directly. Extra features like syntax highlighted code blocks and markdown rendering are optional and only activate if you add their small supporting libraries as dependencies.