Supported Components

mjml-java implements all 31 top-level MJML v4 renderable components. Each component listed below links to the official MJML documentation for attribute details, behavior, and visual examples.

Head Components

Component	Description	MJML Docs
`mj-head`	Container for head elements (title, fonts, styles, attributes)	MJML Docs
`mj-title`	Sets the document `<title>` tag	MJML Docs
`mj-preview`	Sets the email preview text (preheader)	MJML Docs
`mj-font`	Registers a web font via `@import` or `<link>`	MJML Docs
`mj-breakpoint`	Sets the responsive breakpoint width	MJML Docs
`mj-style`	Adds CSS to the document `<head>` or inlines it	MJML Docs
`mj-attributes`	Defines default attribute values for components	MJML Docs
`mj-html-attributes`	Adds custom HTML attributes to rendered elements	MJML Docs

Body Layout Components

Component	Description	MJML Docs
`mj-body`	Root body container; sets the email content width	MJML Docs
`mj-section`	Full-width row container for columns	MJML Docs
`mj-column`	Column within a section (auto-sized or explicit width)	MJML Docs
`mj-group`	Groups columns to prevent stacking on mobile	MJML Docs
`mj-wrapper`	Full-width wrapper around multiple sections	MJML Docs

Content Components

Component	Description	MJML Docs
`mj-text`	Rich text content block	MJML Docs
`mj-image`	Responsive image with optional link	MJML Docs
`mj-button`	Call-to-action button with link	MJML Docs
`mj-divider`	Horizontal rule / separator line	MJML Docs
`mj-spacer`	Vertical spacing element	MJML Docs
`mj-table`	HTML table passthrough	MJML Docs
`mj-raw`	Raw HTML passthrough (not processed by MJML)	MJML Docs

Interactive Components

Component	Description	MJML Docs
`mj-hero`	Hero section with background image and overlay content	MJML Docs
`mj-accordion`	Expandable/collapsible content sections	MJML Docs
`mj-accordion-element`	Single item within an accordion	MJML Docs
`mj-accordion-title`	Title (clickable header) of an accordion element	MJML Docs
`mj-accordion-text`	Body content of an accordion element	MJML Docs
`mj-carousel`	Image carousel / slideshow	MJML Docs
`mj-carousel-image`	Single image within a carousel	MJML Docs
`mj-navbar`	Horizontal navigation bar	MJML Docs
`mj-navbar-link`	Single link within a navbar	MJML Docs
`mj-social`	Social media icon group	MJML Docs
`mj-social-element`	Single social media icon/link	MJML Docs

Include Support

In addition to the 31 components above, mjml-java supports mj-include for splitting templates across files:

<mj-include path="./header.mjml" />
<mj-include path="./styles.mjml" type="css" />
<mj-include path="./styles.mjml" type="css" css-inline="inline" />

Include resolution requires configuring an IncludeResolver:

MjmlConfiguration config = MjmlConfiguration.builder()
    .includeResolver(new FileSystemIncludeResolver(Path.of("/templates")))
    .build();

Custom Components

You can register custom components alongside the built-in ones:

MjmlConfiguration config = MjmlConfiguration.builder()
    .registerComponent("mj-custom", (node, globalCtx, renderCtx) -> {
        return new MyCustomComponent(node, globalCtx, renderCtx);
    })
    .build();

Custom body components extend BodyComponent and implement the render() method. Custom head components extend HeadComponent and implement the process() method.

Note: MJML control/helper tags such as mj-all, mj-class, mj-selector, and mj-html-attribute are supported as part of attribute processing, but they are not counted as top-level renderable components.

For component attributes, behavior, and visual examples, see the official MJML documentation.

Head Components​

Body Layout Components​

Content Components​

Interactive Components​

Include Support​

Custom Components​