DM Editor

Home Development API Data format github project

DM Editor is a block-based visual editor, written in React.

Online demo | An introduction article




npm install dmeditor

Note: to develop widgets, suggest to install @mui/material and @emotion/css so you get all benefits of mui and emotion css. See sample project for detail.


Easy way is to clone Sample project

For edit

import {DMEditor} from 'dmeditor';

<DMEditor data={[]} />

For view

import {DMEditorView} from 'dmeditor';

<DMEditorView data={data} />


Put below in your html to use our open source templates:

<script src=""></script>


dmeditor-digimaker: - Content widgets(eg. content grid, Gallary) for digimaker CMF

Leave a messge here if you want to promote your widgets.

Templates CDN

See to use template CDN. Welcome to send pull request to add your templates.

SSR (Server side rendering)


DM Editor can be used directly in server side rendering via eg. NextJs.

PHP/.NET/Java etc

You can use server side include to embed output of dmeditor-server, which outputs html&css&js from DM Editor’s json data.