Free and open-source email template builder

Free and open-source email template builder

A no-code email template builder that help developers build email templates fast. Output to JSON or HTML.

A no-code email template builder that help developers build email templates fast. Output to JSON or HTML.

JSON or HTML output

Use HTML output directly or convert the JSON output into HTML from within your codebase (using our open-source reader) before sending.

JSON

HTML

{
  "root": {
    "type": "EmailLayout",
    "data": {
      "backdropColor": "#000000",
      "canvasColor": "#000000",
      "textColor": "#FFFFFF",
      "fontFamily": "BOOK_SERIF",
      "childrenIds": [
        "block_ChPX66qUhF46uynDE8AY11",
        "block_CkNrtQgkqPt2YWLv1hr5eJ",
        "block_BFLBa3q5y8kax9KngyXP65",
        "block_4T7sDFb4rqbSyWjLGJKmov",
        "block_Rvc8ZfTjfhXjpphHquJKvP"
      ]
    }
  },
  "block_ChPX66qUhF46uynDE8AY11": {
    "type": "Image",
    "data": {
      "style": {
        "backgroundColor": null,
        "padding": {
          "top": 48,
          "bottom": 24,
          "left": 24,
          "right": 24
        },
        "textAlign": "center"
      },
      "props": {
        "height": 24,
        "width": null,
        "url": "https://d1iiu589g39o6c.cloudfront.net/live/platforms/platform_A9wwKSL6EV6orh6f/images/wptemplateimage_jc7ZfPvdHJ6rtH1W/&.png",
        "alt": "",
        "linkHref": null,
        "contentAlignment": "middle"
      }
    }
  },
  "block_CkNrtQgkqPt2YWLv1hr5eJ": {
    "type": "Text",
    "data": {
      "style": {
        "color": "#ffffff",
        "backgroundColor": null,
        "fontSize": 16,
        "fontFamily": null,
        "fontWeight": "normal",
        "textAlign": "center",
        "padding": {
          "top": 16,
          "bottom": 16,
          "left": 24,
          "right": 24
        }
      },
      "props": {
        "text": "Here is your one-time passcode:"
      }
    }
  },
  "block_BFLBa3q5y8kax9KngyXP65": {
    "type": "Heading",
    "data": {
      "props": {
        "text": "0123456",
        "level": "h1"
      },
      "style": {
        "color": null,
        "backgroundColor": null,
        "fontFamily": null,
        "fontWeight": "bold",
        "textAlign": "center",
        "padding": {
          "top": 16,
          "bottom": 16,
          "right": 24,
          "left": 24
        }
      }
    }
  },
  "block_4T7sDFb4rqbSyWjLGJKmov": {
    "type": "Text",
    "data": {
      "style": {
        "color": "#868686",
        "backgroundColor": null,
        "fontSize": 16,
        "fontFamily": null,
        "fontWeight": "normal",
        "textAlign": "center",
        "padding": {
          "top": 16,
          "bottom": 16,
          "right": 24,
          "left": 24
        }
      },
      "props": {
        "text": "This code will expire in 30 minutes."
      }
    }
  },
  "block_Rvc8ZfTjfhXjpphHquJKvP": {
    "type": "Text",
    "data": {
      "style": {
        "color": "#868686",
        "backgroundColor": null,
        "fontSize": 14,
        "fontFamily": null,
        "fontWeight": "normal",
        "textAlign": "center",
        "padding": {
          "top": 16,
          "bottom": 16,
          "right": 24,
          "left": 24
        }
      },
      "props": {
        "text": "Problems? Just reply to this email."
      }
    }
  }
}

All output from EmailBuilder.js blocks are tested and supported by modern email clients (on both desktop and mobile) including: Gmail, Apple Mail, Outlook, Yahoo! Mail, HEY and Superhuman.

All output from EmailBuilder.js blocks are tested and supported by modern email clients (on both desktop and mobile) including: Gmail, Apple Mail, Outlook, Yahoo! Mail, HEY and Superhuman.

Quick tutorial

Watch a tutorial on how to build a one-time passcode email template in minutes – all within our hosted playground.

⭐️ Star us on GitHub ⭐️

Star us on GitHub

We've been building EmailBuilder.js internally for over a year, however, our open source version is still brand new. If you like what you are seeing, please consider giving the project a star on GitHub.

Brought to you by Waypoint

EmailBuilder.js is the community version of our much-loved no-code template builder on Waypoint. If you are looking for a better collaboration experience for your team, check out Waypoint's email API with a more advanced template builder.