mj-image

Displays a responsive image in your email. It is similar to the HTML <img /> tag.

Note that if no width is provided, the image will use the parent column width.

<mjml>
  <mj-body>
    <mj-section>
      <mj-column>
        <mj-image width="300px" src="https://static.mailjet.com/mjml-website/documentation/image.png" />
      </mj-column>
    </mj-section>
  </mj-body>
</mjml>

Attributes

| attribute | accepts | description | default value | | -------------------------- | ----------------------- | ------------------------------------------------------------------------------- | --------------------- | | align | left center right | image alignment | center | | alt | string | image description | '' | | border | string | CSS border format | 0 | | border-bottom | string | CSS border format | | | border-left | string | CSS border format | | | border-radius | px % | border radius | | | border-right | string | CSS border format | | | border-top | string | CSS border format | | | container-background-color | CSS color formats | inner element background color | | | css-class | string | class name, added to the root HTML element created | | | fluid-on-mobile | boolean | if true, will be full width on mobile even if width is set | | | font-size | px | size of the alt text when image is not rendered | 13px | | height | px | image height | auto | | href | string | link to redirect to on click, in URL format | | | max-height | px % | specify the maximum height of an image | | | name | string | specify the link name attribute | | | padding | px % | hero padding, supports up to 4 parameters | 10px 25px | | padding-bottom | px % | hero bottom padding | | | padding-left | px % | hero left padding | | | padding-right | px % | hero right padding | | | padding-top | px % | hero top padding | | | rel | string | specify the rel attribute | | | sizes | string | set width based on query | | | src | string | image source in URL format | | | srcset | string | enables to set a different image source based on the viewport, using CSS syntax | | | target | string | link target on click | _blank | | title | string | tooltip & accessibility | | | usemap | string | reference to image map, be careful, it isn't supported everywhere | | | width | px | image width | inherits parent width |