Skip to main content
The clarife editor is a block-based content editor built on Tiptap. Each piece of content — a paragraph, heading, screenshot, code snippet, or table — lives in its own block. You can reorder blocks by dragging, delete them, and mix different content types freely.

Editor Layout

The editor screen consists of three main areas:
AreaDescription
Toolbar (top)Document title, save status indicator, template selector, share/export/video buttons, back navigation
Block canvas (center)The main editing area where you add and arrange content blocks
Block controls (left of each block)Drag handle and delete button, visible on hover

Available Block Types

clarife supports seven block types. Click the + button between blocks or at the bottom of the document to add a new one.
BlockDescriptionShortcut
ParagraphStandard text with inline formatting (bold, italic, links)Default block
HeadingSection headers in three levels (H1, H2, H3)
CodeSyntax-highlighted code snippets with 20 language options
TableStructured data in rows and columns
ScreenshotImages with optional annotations and enhancement
DividerVisual separator between sections
BlockquoteHighlighted callout or quote text

Adding Blocks

1

Click the add button

Hover between any two blocks to reveal the + button, or scroll to the bottom of the document.
2

Choose block type

Select from the block type menu: text, heading, screenshot, code, table, or divider.
3

Enter content

Start typing or uploading content depending on the block type.

Reordering Blocks

Every block has a drag handle (the six-dot grip icon) on its left side, visible when you hover over the block. Click and hold the grip, then drag the block to a new position. A colored line indicates where the block will be placed when you release.

Deleting Blocks

Click the trash icon next to the drag handle to remove a block. This action is immediate — there is no confirmation dialog.
Deleting a block cannot be undone. If you accidentally remove content, use your browser’s undo shortcut (Cmd+Z / Ctrl+Z) immediately — it may restore the block depending on the operation.

Auto-Save

The editor auto-saves your work as you type. The save status is shown in the top toolbar:
  • Saving… — changes are being sent to the server
  • Unsaved changes — local edits not yet saved (will save shortly)
  • Save failed — an error occurred; check your connection and try again

Templates

Click the Template button in the toolbar to apply a pre-built document structure. Templates insert a set of blocks (headings, text placeholders, screenshot slots) that you can then fill in with your own content.
Applying a template replaces the current document content. Use it on new or empty documents.

Keyboard Shortcuts

ActionmacOSWindows/Linux
BoldCmd+BCtrl+B
ItalicCmd+ICtrl+I
UndoCmd+ZCtrl+Z
RedoCmd+Shift+ZCtrl+Shift+Z
Paste imageCmd+VCtrl+V

Next Steps

Text Blocks

Paragraphs, headings, lists, and blockquotes.

Screenshots

Upload, paste, and manage images.

Annotations

Arrows, shapes, text overlays, and more.
The editor supports basic Markdown shortcuts inline — for example, typing **text** converts to bold, and # at the start of a line creates a heading. However, it is primarily a visual block editor, not a raw Markdown editor.
There is no hard limit on the number of blocks. Very large documents (100+ blocks with many screenshots) may affect editor performance and export times.
Real-time collaboration is not currently supported. You can share documents via links and control access with passwords, email gates, or domain allowlists.
The editor is optimized for desktop browsers. While it loads on tablets and phones, the full editing experience (drag-and-drop, annotations, enhancer) works best on desktop.