Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

mjml

Package Overview
Dependencies
Maintainers
5
Versions
164
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

mjml

MJML: the only framework that makes responsive-email easy

  • 4.1.0
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
532K
decreased by-13.65%
Maintainers
5
Weekly downloads
 
Created

What is mjml?

MJML is a markup language designed to reduce the pain of coding responsive emails. It abstracts away the complexity of responsive design by providing a simple syntax that translates into responsive HTML.

What are mjml's main functionalities?

Responsive Email Design

MJML allows you to create responsive email designs easily. The above code creates a simple responsive email with a 'Hello World' text.

<mjml>
  <mj-body>
    <mj-section>
      <mj-column>
        <mj-text>Hello World</mj-text>
      </mj-column>
    </mj-section>
  </mj-body>
</mjml>

Custom Components

MJML provides a variety of built-in components like buttons, images, and text blocks. The above code demonstrates how to create a button that links to a URL.

<mjml>
  <mj-body>
    <mj-section>
      <mj-column>
        <mj-button href="https://www.example.com">Click Me</mj-button>
      </mj-column>
    </mj-section>
  </mj-body>
</mjml>

Conditional Rendering

MJML supports conditional rendering for different email clients. The above code shows how to include content specifically for Microsoft Outlook.

<mjml>
  <mj-body>
    <mj-raw>
      <!--[if mso]>
      <mj-section>
        <mj-column>
          <mj-text>Microsoft Outlook specific content</mj-text>
        </mj-column>
      </mj-section>
      <![endif]-->
    </mj-raw>
  </mj-body>
</mjml>

Other packages similar to mjml

FAQs

Package last updated on 28 Jun 2018

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc