Launch a modern email builder your users can trust
Combine GrapesJS with MJML plugins to deliver drag-and-drop editing, responsive output, and full ownership of templates, data, and integrations. No per-send platform tax, no hidden feature gates, and no lock-in.
100% ownership
Self-hosted architecture and data
MJML-ready
Responsive output for major clients
API-flexible
Works with any ESP workflow
Fast to ship
Plugin ecosystem for common needs
Why Use GrapesJS for Email — 5 Reasons Over Hosted Tools
No per-send pricing
Hosted email builders often charge per email sent or per subscriber. With GrapesJS, the builder is yours — integrate with any ESP and pay only for what you send.
Own your data
Email templates, user preferences, and export history stay on your infrastructure. No third-party access to your templates or customer data.
Custom blocks
Build unlimited custom blocks tailored to your brand — product cards, event banners, dynamic content zones — with full control over the HTML output.
Self-hosted
Deploy the email builder to your own server, VPS, or cloud environment. No SaaS dependency, no pricing tier changes, no feature gating.
Integrate with any API
Connect directly to Mailchimp, SendGrid, Postmark, or your own email delivery service. GrapesJS is agnostic — the output is clean HTML and MJML.
Who This Builder Is Best For
SaaS product teams
Add an in-app template editor so customers can design lifecycle, onboarding, and marketing emails without engineering support.
Agencies and studios
Create reusable branded template systems with locked sections, editable zones, and approval-ready exports.
Internal growth teams
Run faster campaigns with pre-approved modules, safer editing constraints, and consistent responsive output.
MJML Integration — Why It Solves Email Rendering
Email HTML is notoriously difficult to get right across clients. Gmail strips certain CSS properties. Outlook uses Microsoft Word's rendering engine. Apple Mail handles things differently again. The result: developers spend hours debugging table-based layouts that look broken in one client or another.
MJML solves this by providing a set of semantic components — mj-section, mj-column, mj-text, mj-image — that compile to battle-tested HTML table layouts. The GrapesJS MJML plugin maps these components to draggable blocks, giving your users a visual editor that outputs cross-client responsive email HTML automatically.
GrapesJS Email Preset Initialization
The following example initializes GrapesJS with the newsletter preset plugin and demonstrates how to retrieve HTML, CSS, and MJML output from the editor.
import grapesjs from 'grapesjs';
import grapesjsNewsletterPlugin from 'grapesjs-preset-newsletter';
const editor = grapesjs.init({
container: '#editor',
plugins: [grapesjsNewsletterPlugin],
pluginsOpts: {
[grapesjsNewsletterPlugin]: {
// Newsletter plugin options
modalLabelImport: 'Paste all your code here below and click import',
modalLabelExport: 'Copy the code and use it wherever you want',
},
},
storageManager: false,
});
// Get HTML output
const html = editor.getHtml();
const css = editor.getCss();
// Get MJML output (with MJML plugin)
const mjml = editor.runCommand('mjml-export');Email Builder Plugins on GJS.Market
GrapesJS MJML
Build MJML-based responsive email templates with drag-and-drop
Newsletter Preset
Pre-built newsletter blocks, sections, and column layouts
Email Preview Plugin
Preview emails across desktop and mobile viewports
Dynamic Content Blocks
Merge tag support and conditional content blocks
ESP Export Plugin
Export templates directly to Mailchimp, SendGrid, or Postmark
HTML Email Inliner
Automatically inline CSS for maximum email client compatibility
Practical Launch Roadmap
Embed the editor
Mount GrapesJS in your app with newsletter and MJML plugins so users can start from email-safe blocks.
Store project JSON
Save editor.getProjectData() for autosave, version history, and restoring drafts across sessions.
Export and validate
Compile to HTML/MJML, inline CSS, and run client previews before handing off to your ESP.
Ship integrations
Connect Mailchimp, SendGrid, Postmark, or internal APIs for template sync and campaign workflows.
Email Output Formats
HTML
Most compatibleStandard HTML output with inline styles. Compatible with all email clients. Use editor.getHtml() and editor.getCss() to retrieve the output.
MJML
RecommendedMJML is a markup language that compiles to responsive HTML. Using the GrapesJS MJML plugin, your users build with MJML components and export clean, client-safe HTML.
JSON
For storageGrapesJS stores the canvas as a JSON component tree. Use editor.getProjectData() to save and restore templates programmatically in your database.
Frequently Asked Questions
Ready to ship a better email-building experience?
Explore plugins, wire the editor into your product, and launch a workflow your team and users will actually enjoy.