Edit

Craft.js is a React framework for building powerful & feature-rich drag-n-drop page editors.

Everything you see here, including the editor, itself is made of React components. Craft.js comes only with the building blocks for a page editor; it provides a drag-n-drop system and handles the way user components should be rendered, updated and moved, among other things.

You control the way your editor looks and behave.

Design complex components

You can define areas within your React component which users can drop other components into.

You can even design how the component should be edited — content editable, drag to resize, have inputs on toolbars — anything really.

Programmatic drag & drop

Govern what goes in and out of your components

I'm a component that only accepts
buttons.

You can only drop
one video here.

I must have at least 1 button

Customize

Click on a component to start editing.

You could also double click on the layers below to edit their names, like in Photoshop

Layers