# TinyMCE: a self-hosted WYSIWYG editor, its licence boundary and its real cost

> TinyMCE is a TypeScript monorepo that ships a contenteditable-based rich text editor under GPLv2-or-later, with React, Vue and Angular wrappers and a commercial cloud tier behind it. This review covers how it installs, how it is configured, where the licence stops being convenient, and when a lighter editor is the better call.

**tinymce/tinymce** — The world's #1 JavaScript library for rich text editing. Available for React, Vue and Angular

- Repository: https://github.com/tinymce/tinymce
- Website: https://www.tiny.cloud
- Stars: 16,307 · Forks: 2,341
- Language: TypeScript
- License: NOASSERTION
- Published: 2026-09-21 · Updated: 2026-09-21 · Language: en
- Canonical page: https://hysenlabs.com/projects/tinymce-tinymce

## What TinyMCE solves, and for whom

The problem is the one every product team hits eventually: users need to produce formatted HTML, and contenteditable on its own is a minefield of browser inconsistencies. TinyMCE wraps that behaviour in a configurable editor with a toolbar, menus, keyboard handling and a plugin surface. The README describes it as "the world's #1 open source rich text editor" and lists three editing modes: classic, inline, and distraction-free. Those are genuinely different integration shapes. Classic renders a framed editor in a fixed slot. Inline attaches to an existing element so the page itself becomes editable. Distraction-free hides the chrome until the user needs it.

The audience is narrower than the download numbers suggest. TinyMCE fits products that treat authored content as a first-class asset: a CMS, a help desk, an email composer, a documentation tool. It is less obviously right for a comment box. The repository is a monorepo with modules/* workspaces, and the wrappers live in separate repositories (tinymce-react, tinymce-vue, tinymce-angular), so you are adopting an editor plus a thin framework binding rather than a single package.

## How the editor is built: monorepo, oxide, and the contenteditable core

The architecture visible in the repository is a TypeScript monorepo. The root package.json declares workspaces of modules/*, and the build scripts show the shape of the dependency graph. There is a Gruntfile.js at the root and a separate one under modules/tinymce, driven through the tinymce-grunt script. There is an Oxide UI layer (oxide-build, oxide-start, oxide-ci) and an icon package (@tinymce/oxide-icons-default) that the editor's chrome depends on. A typical full build chains agar-sw-build, oxide-icons-build, oxide-build, the TypeScript project build (tsc -b) and the Grunt dev task, which is what the dev script does in parallel.

The runtime mechanism is contenteditable. The README states that content editable is "the basis of TinyMCE", and that adding functionality is a single line of code for most plugins, with a few more lines for full behaviour. That is the honest summary of the plugin model: the plugin registers into the editor, and the editor exposes its API at tinymce.root for custom extensions and custom UI components. If you are writing your own toolbar button or dialog, that API is the entry point rather than DOM surgery on the iframe.

The monorepo also carries a release process worth knowing about if you plan to contribute. Changes are tracked as files under .changes/unreleased/, and the Makefile batches them with changie per package, reading versions from versions.txt and modules/tinymce/package.json. TinyMCE itself is treated as a special case in that Makefile, separate from the other packages. In practice this means a contribution that changes editor behaviour is expected to arrive with a changelog fragment, not just a diff.

## Installing TinyMCE and getting a working editor on the page

The README points at two deployment paths rather than printing install commands: a cloud quick start guide at www.tiny.cloud/docs/tinymce/8/cloud-quick-start/ and a self-hosted deployment guide for npm projects at www.tiny.cloud/docs/tinymce/8/npm-projects/. For a self-hosted setup the editor package is published to npm under the name tinymce. The repository does not document a rollback procedure for a bad upgrade, so plan your own pinning.

The repository's root package.json documents the development entry point for the monorepo itself. Running it starts the modules/tinymce dev task:

```bash
bun --cwd modules/tinymce dev
```

That is the script published as "start" in the root package.json. It is the monorepo's own dev server, not an application install step.

The build pipeline for the editor is driven through Grunt. The root package.json exposes it as tinymce-grunt, and the Makefile and build scripts reference the same task names. A full local build in the repository is the "build" script, which runs the Oxide CI tasks, the icon and component CI tasks, and then the Grunt task:

```bash
npm-run-all oxide-ci -p oxide-icons-ci oxide-components-ci -s tinymce-grunt
```

What you should see is the editor bundle produced under the modules/tinymce workspace. The root package.json is the authoritative list of scripts; the README does not restate them, so read package.json rather than guessing at task names.

For application integration the README links three wrapper repositories rather than printing install commands: tinymce-react, tinymce-vue and tinymce-angular. The README describes adding a plugin as including a single line of code in the editor configuration, and points at the basic setup documentation for the configuration object itself. The selector-based initialisation pattern is what the README's basic setup documentation covers, but the README does not print the configuration snippet, so take the exact option names from that page rather than from this article.

## The licence is the actual adoption decision

The repository's licence field is NOASSERTION, and the README states the project is licensed under GNU General Public License Version 2 or later, pointing at LICENSE.md for the full text. For a JavaScript library that ships into a web front end, that is not a formality. GPLv2-or-later is a copyleft licence, and how it interacts with your bundle is a question for your own legal review, not for this article.

What is verifiable is the structure of the offer. TinyMCE is open source and self-hostable, and the same README that states the GPL terms also describes professional tiers: enterprise-grade collaboration and compliance features, dedicated SLAs and support, and a contact form for teams that need them. So there are two distinct products sharing one codebase and one brand. The open source editor is real and the source is available; the commercial tier is where the vendor's revenue sits.

The practical consequence is that "is TinyMCE free?" has two answers depending on which artefact you ship. The self-hosted GPL build is free to obtain. Whether your distribution obligations are acceptable is a separate judgement. The README does not enumerate which plugins are premium, so if a feature list matters to you, confirm it against the documentation before you build a roadmap on it.

## Where TinyMCE is the wrong choice

The first failure mode is weight. TinyMCE is designed for difficult edge cases, and that design costs bundle size and configuration surface. If your requirement is bold, italic, a link and a list, you are paying for a plugin architecture you will not use, and a smaller editor will get you there with less code and less to explain to the next engineer.

The second is the licence. If your organisation cannot accept copyleft in a distributed front end and will not buy a commercial licence, TinyMCE is simply the wrong tool regardless of its feature set. That is a constraint, not a criticism.

The third is the upgrade treadmill. The README opens by recommending an upgrade to TinyMCE 8 for anyone on an old version, framed around continuing to receive security updates. That is a clear signal that staying on an old major is a supported-but-decaying position. The repository has no documented rollback path, and the wrappers version separately from the editor, so a team that cannot absorb periodic major upgrades should weigh that before adopting.

Finally, AI detection. It is a question people ask, and nothing in the README or the repository description claims that TinyMCE detects AI-generated text. It is an editor. Do not adopt it expecting that capability.

## TinyMCE compared with Quill

Quill is the comparison people actually search for, and the difference is architectural rather than cosmetic. Quill builds on its own document model: content is represented as a Delta, and the rendered DOM is derived from that model. TinyMCE works against contenteditable directly, with the browser as the source of truth for the document. The README is explicit that content editable is "the basis of TinyMCE".

That difference drives everything downstream. A model-based editor gives you predictable transformation and serialisation because you control the intermediate representation. A contenteditable-based editor gives you fidelity to whatever the browser does natively, which is why TinyMCE invests so heavily in handling browser edge cases and why its configuration surface is large. If your hardest problem is programmatic document manipulation, the Delta model is the more natural fit. If your hardest problem is pasting from Word, or matching a toolbar to a design system, TinyMCE's plugin catalogue and UI configuration are the more direct route.

TinyMCE is also the larger commitment. The monorepo, the separate framework wrappers, the changie release flow and the premium tier all point at a project built for teams that will keep it for years. Quill is lighter to start with and lighter to abandon.

## Conclusion

Adopt TinyMCE if you need a long-lived, plugin-heavy WYSIWYG editor and you can live with GPLv2-or-later or buy a commercial licence. Do not adopt it for a small internal form that needs bold and links, and do not adopt it if your legal position cannot tolerate copyleft. Before you commit, verify three things: the exact licence file in the version you install, which plugins you actually need and whether they are premium, and whether the self-hosted bundle plus the tinymce-react wrapper loads without a cloud API key in your build.

## FAQ

### What is TinyMCE used for?

It is a JavaScript rich text editor used to let people author formatted HTML inside a web application. The README describes three editing modes (classic, inline and distraction-free) and integrations for React, Vue and Angular.

### Is TinyMCE free to use?

The README states the project is licensed under GNU General Public License Version 2 or later, so the self-hosted source is free to obtain. The same README also describes commercial enterprise features, SLAs and support for professional teams, so the free and paid offerings are separate.

### Does TinyMCE detect AI?

No. Neither the README nor the repository description claims any AI-detection capability; TinyMCE is presented purely as a rich text editor.

### How do I install TinyMCE?

The README points to a cloud quick start guide and a self-hosted deployment guide for npm projects rather than printing install steps. In a self-hosted npm setup the editor package is named tinymce, and the framework bindings such as tinymce-react are installed alongside it.

### How do I use the TinyMCE editor in HTML?

The README's basic setup documentation covers selector-based initialisation, and the README describes adding a plugin as including a single line of code. The README itself does not print the configuration snippet, so take the exact option names from that page.

### How do I use TinyMCE in React?

The README lists tinymce-react as the integration component for React projects and links to that repository for details. The README does not document the component's props, so treat that repository as the source of truth.

## Sources

- [Issues](https://github.com/tinymce/tinymce/issues)
- [Project website](https://www.tiny.cloud)
- [README](https://github.com/tinymce/tinymce/blob/main/README.md)
- [tinymce/tinymce on GitHub](https://github.com/tinymce/tinymce)

---

Hysen Labs editorial analysis, written from the project's own repository and release notes. Cite the canonical page: https://hysenlabs.com/projects/tinymce-tinymce