GrapesJS Starter

HTML

<script src="https://unpkg.com/grapesjs@0.14.40/dist/grapes.js"></script>
<link rel="stylesheet" href="https://unpkg.com/grapesjs/dist/css/grapes.min.css">
<script src="https://unpkg.com/grapesjs-blocks-basic"></script>
<script src="https://unpkg.com/grapesjs-style-filter@0.1.1/dist/grapesjs-style-filter.min.js"></script>
<div id="gjs">
  <div style="padding: 25px">Hello World!!!</div>
  <img src="https://picsum.photos/500/350"/>
</div>

CSS

body, html {
  margin: 0;
  height: 100%;
}

Babel + JSX

const editor = grapesjs.init({
	container: '#gjs',
  fromElement: 1,
  height: '100%',
  storageManager: { type: 0 },
  plugins: [
  	'gjs-blocks-basic',
    'grapesjs-style-filter',
  ]
});

editor.StyleManager.addProperty('Extra', {
  name: 'Filter',
  property: 'filter',
  type: 'filter',
  full: 1,
});