Unlayer Documentation

Unlayer Documentation

Welcome to Unlayer Documentation. It takes less than 5 minutes to get our editor up and running on your project.

These guides will take you through the process and get you up and running.

Get Started    

React Component

Unlayer editor is also available as a React component.


The easiest way to use it is to install it from npm and include it in your own React build process.


npm install react-email-editor --save


yarn add react-email-editor


Require the EmailEditor component and render it with JSX:

import React, { useRef } from 'react';
import { render } from 'react-dom'

import EmailEditor from 'react-email-editor';

const App = (props) => {
  const emailEditorRef = useRef(null);

  const exportHtml = () => {
    emailEditorRef.current.editor.exportHtml((data) => {
      const { design, html } = data;
      console.log('exportHtml', html);

  const onLoad = () => {
    // you can load your template here;
    // const templateJson = {};
    // emailEditorRef.current.editor.loadDesign(templateJson);

  return (
        <button onClick={exportHtml}>Export HTML</button>

render(<App />, document.getElementById('app'))


loadDesign Object dataTakes the design JSON and loads it in the editor
saveDesign Function callbackReturns the design JSON in a callback function
exportHtml Function callbackReturns the design HTML and JSON in a callback function


NameTypeDescriptionDefault Value
styleObjectstyle object for the editor container{}
minHeightStringminimum height to initialize the editor with500px
onLoadFunctioncalled when the editor has finished loading
optionsObjectoptions passed to the Unlayer editor instance{}
toolsObjectconfiguration for the built-in and custom tools{}
appearanceObjectconfiguration for appearance and theme{}
projectIdIntegerUnlayer project ID (optional)


See the example source for a reference implementation.

Updated about a month ago

React Component

Suggested Edits are limited on API Reference Pages

You can only suggest edits to Markdown body content, but not to the API spec.