Markdown

EMarkdown renders Markdown to email-safe HTML with inline styles and per-element overrides.

EMarkdown

EMarkdown renders Markdown to email-safe HTML with inline styles. It is useful when content comes from a content management system (CMS) rather than Vue markup.

Prop	Type	Default	Required
`source`	`string`	Text-only default slot	No
`markdownCustomStyles`	Per-element style map	Built-in email-safe styles	No

When source is a string, it takes precedence over the default slot. Custom styles merge over the defaults.

Raw HTML is rejected, including HTML comments. Links and images accept relative URLs plus http, https, mailto, tel, and cid; other schemes are rejected after HTML-entity and control-character normalization. HTML-looking text inside code spans and fences is escaped. This keeps Markdown from becoming an implicit raw-HTML escape hatch.

The rendered container accepts Vue's normal class, style, and safe HTML attributes. Use ordinary string, object, or array style values; include CSS units explicitly for dimensional values such as padding.

The default slot must contain text only; an element child throws a TypeError rather than being silently stringified. Links render with target="_blank", and tables render with role="presentation".

vue

<EMarkdown source="# Title\n\nA paragraph with a [link](https://example.com)." />

With overrides:

vue

<EMarkdown
  :source="body"
  :markdown-custom-styles="{ h1: { color: '#0f172a' }, a: { color: '#2563eb' } }"
  :style="{ padding: '0 24px' }"
/>

Divergence: no data-id marker

Unlike React Email, the container omits the data-id="react-email-markdown" marker (the same no-data-id divergence as EColumn). No Vue behavior consumes the marker. See the conformance report.