Hi HN! I built this WYSIWYG editor as an extraction from the admin of a gaming news site (todojuegos.com) I've maintained since the early 2000s. The main goal was to have a full-featured editor with zero npm dependencies, just a single JS + CSS file.
Key features: 35+ built-in features, 7 languages, dark/light themes, slash commands, Markdown import/export, table editing, emoji picker, code blocks... all at ~120KB with no external dependencies.
It uses contentEditable + document.execCommand (yes, I know it's "deprecated" but it works reliably across browsers).
Thanks! The project started because I needed to replace Xinha (https://xinha.webfactional.com/) in the admin panel of a gaming news site I've been running since the early 2000s. Xinha served me well for years, but it was no longer actively maintained and had accumulated a lot of legacy baggage. I wanted something lightweight that just worked without pulling in a framework or a tree of dependencies.
Development time: the core editor took a few weeks of focused work, but I've been iterating on features for a couple of months now (slash commands, markdown mode, table editing, etc.).
Regarding Tiptap: it's a great project and I have a lot of respect for it. They're solving a different problem though. Tiptap is built on top of ProseMirror, which gives you a proper document model, collaborative editing, and a very composable extension architecture. If you're building something like Notion or a collaborative SaaS editor, that's absolutely the right choice.
The trade-off is complexity and size. Tiptap pulls in ProseMirror and its own packages, easily 200KB+ of dependencies before you even add extensions. You need a bundler, a build step, and you install features one by one as separate packages.
Zero WYSIWYG comes from the opposite direction. It's a single JS file and a single CSS file, about 120KB total, zero dependencies. You drop a `<script>` tag in your page, call `init()`, and you immediately get it working.
It's really aimed at a different use case: traditional server-rendered sites (PHP, Django, Rails...) where you just need a reliable textarea replacement in your admin panel without introducing a build pipeline or a framework dependency. That's the world I come from, and that's the itch it scratches.
Hi HN! I built this WYSIWYG editor as an extraction from the admin of a gaming news site (todojuegos.com) I've maintained since the early 2000s. The main goal was to have a full-featured editor with zero npm dependencies, just a single JS + CSS file.
Key features: 35+ built-in features, 7 languages, dark/light themes, slash commands, Markdown import/export, table editing, emoji picker, code blocks... all at ~120KB with no external dependencies.
It uses contentEditable + document.execCommand (yes, I know it's "deprecated" but it works reliably across browsers).
Live demo: https://katxi.github.io/zero-wysiwyg/
wow this looks super cool!
How long did it take to develop?
Have you considered the competitors like tiptap editor? Curious what is your opinion VS tiptap's pros/cons.
Thanks! The project started because I needed to replace Xinha (https://xinha.webfactional.com/) in the admin panel of a gaming news site I've been running since the early 2000s. Xinha served me well for years, but it was no longer actively maintained and had accumulated a lot of legacy baggage. I wanted something lightweight that just worked without pulling in a framework or a tree of dependencies.
Development time: the core editor took a few weeks of focused work, but I've been iterating on features for a couple of months now (slash commands, markdown mode, table editing, etc.).
Regarding Tiptap: it's a great project and I have a lot of respect for it. They're solving a different problem though. Tiptap is built on top of ProseMirror, which gives you a proper document model, collaborative editing, and a very composable extension architecture. If you're building something like Notion or a collaborative SaaS editor, that's absolutely the right choice.
The trade-off is complexity and size. Tiptap pulls in ProseMirror and its own packages, easily 200KB+ of dependencies before you even add extensions. You need a bundler, a build step, and you install features one by one as separate packages.
Zero WYSIWYG comes from the opposite direction. It's a single JS file and a single CSS file, about 120KB total, zero dependencies. You drop a `<script>` tag in your page, call `init()`, and you immediately get it working.
It's really aimed at a different use case: traditional server-rendered sites (PHP, Django, Rails...) where you just need a reliable textarea replacement in your admin panel without introducing a build pipeline or a framework dependency. That's the world I come from, and that's the itch it scratches.