The text editor that enforces the rules

Write freely.
Enforce rules when you need them.

NGTextEditor is an embeddable text editor that allows either free use or strictly controlled use through simple configuration. It prevents inconsistent content, formatting drift, and errors that end up breaking your interfaces.

An editor designed to protect your content, not just format it.

See the demo Read the documentation

Classic editors allow too much freedom

In most applications:

  • Users can do anything
  • Rules are implicit
  • Brand guidelines are bypassed
  • HTML becomes inconsistent
  • Support and maintenance explode

Generic editors hope everything goes well.

In practice, it never does.

An editor governed by explicit rules

NGTextEditor works differently.

Instead of exposing all possible options, it relies on a declarative configuration (JSON) that precisely defines:

  • What is allowed
  • What is forbidden
  • How content should be structured

The editor applies these rules in real-time. Users cannot go outside the framework.

// Declarative configuration 
"media": {
  "link": true,
  "image": {
    "activate": true,
    "allowImageUrl": true,
    "allowDragNDrop": true,
    "allowRotation": true,
    "allowOpacity": true,
    "allowBorder": true
  },
  "video": {
    "activate": true,
    "allowBorder": false
  },
  "table": true,
  "columns": {
    "activate": true,
    "maxNumberOfColumns": 3,
    "allowBorder": true
  },
  "emoji": true
}

How it works

One engine, two usage modes

Free mode

All tools available

Perfect for:

  • Blogs
  • Personal websites
  • Side-projects

No unnecessary locks

Governed mode

Strictly controlled tools and styles

Alignment with:

  • Brand guidelines
  • Product rules
  • Content types

Ideal for:

  • Businesses
  • Teams
  • Multi-user applications

The same editor adapts to your product's maturity.

A block and grid-based editor

A structured approach for controlled content

Unlike classic editors, NGTextEditor works with a block system positioned on a 12-column grid. This approach guarantees total control over layout and content structure.

How it works

  1. Right-click in the editing area
  2. Choose the block type: text or media
  3. Set the block width (10% to 100%)
  4. Confirm: a visual grid appears
  5. Click on the desired position in the grid
  6. Create your content in the block
Text block

To write text, create lists, insert quotes, apply styles...

Media block

To insert images, videos, tables or columns

The positioning grid

When creating or moving a block, a visual grid appears:

  • Green cells : available positions to place your block
  • Red cells : positions occupied by other blocks
  • "Insert a row here" and "New row" zones to manage rows

Reposition or configure a block

Each block has a gear button (⚙) at the top left. Click it to access options: reposition the block on the grid or modify its configuration (width, background image, delete).

Block management
Hover over a block to see the gear button (⚙). A single button groups all options: reposition, configure, or delete. Clean interface for an uncluttered editing area.

Benefits of this approach

  • Precise layout using the 12-column grid
  • Elements side by side easily (e.g., 50% image + 50% text)
  • Easy reorganization via the configuration button
  • Flexible and modular document structure
  • HTML and PDF export faithful to what is edited
  • Ability to nest blocks within blocks
Tips
  • Use "Block outlines" in the toolbar to visualize boundaries
  • Blocks automatically wrap to the next row if there's not enough space
  • Nest blocks for complex layouts

What NGTextEditor prevents (and it's intentional)

Inconsistent styles
Unpredictable HTML
Dirty copy-paste
Design drift
Unmaintainable content

Less unnecessary freedom.

Fewer bugs.

Less support.

What you actually gain

For developers

  • Simple integration
  • Predictable behavior
  • Fewer edge cases to handle
  • Content usable on frontend and API
  • Fully tested (unit + functional): reliable and maintainable

For product / design teams

  • Automatic brand compliance
  • Global consistency
  • No manual reminders needed
  • Auto-detect site colors to add them to the palette

For end users

  • Clear interface
  • Impossible to "do it wrong"
  • Less frustration

Typical use cases

CMS or application back-office
Controlled marketing content
Onboarding pages
Structured FAQs
Internal documentation
Multi-user content

If your content needs to stay consistent, stable, and maintainable, NGTextEditor is for you.

Clear positioning

NGTextEditor is not:

  • An "all-in-one" editor
  • A clone of an existing editor
  • A mini Word in a browser

It is:

An editor that enforces rules rather than relying on user discipline.

Start simply

Integrate NGTextEditor

Use it freely

Add rules when you need them

Get started with NGTextEditor Documentation & configuration

Good tools give power.

The best tools prevent mistakes.