Show HN: Domternal – headless rich-text editor for Angular/React/Vue/Vanilla

thomasnowhere1 pts0 comments

Domternal - Rich Text Editor for Angular, React, Vue & Vanilla JS

Domternal ☾ Get started →

DocsBlogTutorialsGitHubContact<br>Follow on X<br>☾ Toggle theme

Classic

Notion-style

Headless Toolkit

The Rich Text Editor<br>your framework<br>deserves

Classic and Notion-style editors out of the box.

Or go headless and assemble from 70+ tree-shakeable extensions.

First-class wrappers for Angular , React , Vue , and Vanilla .

Simple toolbar Full toolbar Notion-style

0 words / 0 characters

Loading editor…

15,000+<br>Tests

70+<br>Extensions

~44 KB<br>own code<br>100%<br>TypeScript

Tree-shakeable &diams; Classic + Notion modes &diams; Headless toolkit &diams; Angular · React · Vue · Vanilla &diams; MIT licensed &diams; Tables with merge &diams; Slash command &diams; Markdown shortcuts &diams; Drag & drop blocks &diams; Block context menu &diams; Light + dark theme &diams; Image upload &diams; SSR ready &diams; Built on ProseMirror &diams; Brushed to spec &diams; Tree-shakeable &diams; Classic + Notion modes &diams; Headless toolkit &diams; Angular · React · Vue · Vanilla &diams; MIT licensed &diams; Tables with merge &diams; Slash command &diams; Markdown shortcuts &diams; Drag & drop blocks &diams; Block context menu &diams; Light + dark theme &diams; Image upload &diams; SSR ready &diams; Built on ProseMirror &diams; Brushed to spec &diams; Tree-shakeable &diams; Classic + Notion modes &diams; Headless toolkit &diams; Angular · React · Vue · Vanilla &diams; MIT licensed &diams; Tables with merge &diams; Slash command &diams; Markdown shortcuts &diams; Drag & drop blocks &diams; Block context menu &diams; Light + dark theme &diams; Image upload &diams; SSR ready &diams; Built on ProseMirror &diams; Brushed to spec &diams; Tree-shakeable &diams; Classic + Notion modes &diams; Headless toolkit &diams; Angular · React · Vue · Vanilla &diams; MIT licensed &diams; Tables with merge &diams; Slash command &diams; Markdown shortcuts &diams; Drag & drop blocks &diams; Block context menu &diams; Light + dark theme &diams; Image upload &diams; SSR ready &diams; Built on ProseMirror &diams; Brushed to spec &diams;

Tree-shakeable &loz; Classic + Notion modes &loz; Headless toolkit &loz; Angular · React · Vue · Vanilla &loz; MIT licensed &loz; Tables with merge &loz; Slash command &loz; Markdown shortcuts &loz; Drag & drop blocks &loz; Block context menu &loz; Light + dark theme &loz; Image upload &loz; SSR ready &loz; Built on ProseMirror &loz; Brushed to spec &loz; Tree-shakeable &loz; Classic + Notion modes &loz; Headless toolkit &loz; Angular · React · Vue · Vanilla &loz; MIT licensed &loz; Tables with merge &loz; Slash command &loz; Markdown shortcuts &loz; Drag & drop blocks &loz; Block context menu &loz; Light + dark theme &loz; Image upload &loz; SSR ready &loz; Built on ProseMirror &loz; Brushed to spec &loz; Tree-shakeable &loz; Classic + Notion modes &loz; Headless toolkit &loz; Angular · React · Vue · Vanilla &loz; MIT licensed &loz; Tables with merge &loz; Slash command &loz; Markdown shortcuts &loz; Drag & drop blocks &loz; Block context menu &loz; Light + dark theme &loz; Image upload &loz; SSR ready &loz; Built on ProseMirror &loz; Brushed to spec &loz; Tree-shakeable &loz; Classic + Notion modes &loz; Headless toolkit &loz; Angular · React · Vue · Vanilla &loz; MIT licensed &loz; Tables with merge &loz; Slash command &loz; Markdown shortcuts &loz; Drag & drop blocks &loz; Block context menu &loz; Light + dark theme &loz; Image upload &loz; SSR ready &loz; Built on ProseMirror &loz; Brushed to spec &loz;

01<br>70+ Built-in Extensions<br>26 nodes, 9 marks, 27 extensions across 16 tree-shakeable packages. Tables with merge, images, emoji, mentions, details, LaTeX math, syntax highlighting, Notion-style blocks, and table of contents.

02<br>Angular, React, Vue & Vanilla Wrappers<br>Drop-in editor, toolbar, bubble menu, floating menu, emoji picker, and Notion color picker. Or skip them - use the headless core with any framework.

03<br>Built-in Toolbar & Theme<br>Each extension contributes toolbar items via addToolbarItems(). 51 Phosphor icons. Light and dark themes via CSS custom properties - restyle with one declaration.

04<br>Styled HTML Export<br>getHTML({ styled: true }) outputs inline CSS that survives email clients, CMS rich-text fields, and Google Docs paste. No external stylesheet required.

05<br>Markdown + Slash Commands<br>Type ## for headings, **bold**, > for blockquote, --- for divider, or / to open the slash menu. Input rules registered by every extension.

06<br>Notion-style Block UX<br>Hover to grab a block, drag to reorder. Right-click for duplicate, turn into, color, or copy link. Tab to indent. Toggle the mode on with .dm-notion-mode.

BoldItalicUnderlineStrikethroughCodeLinkSubscriptSuperscriptHighlightText ColorBoldItalicUnderlineStrikethroughCodeLinkSubscriptSuperscriptHighlightText ColorBoldItalicUnderlineStrikethroughCodeLinkSubscriptSuperscriptHighlightText...

diams notion headless angular react vanilla

Related Articles