[Skip to content](#main)

[→](/)

[![Avunu](/brand/avunu-logo.svg)![Avunu](/brand/avunu-logo-light.svg)](/)[Services](/services/)[Consulting](/services/consulting/)[ERP](/services/erp/)[Odoo](/services/erp/odoo/)[ERPNext](/services/erp/erpnext/)[Custom software](/services/custom-software/)[Devices & IoT](/services/devices-iot/)[Websites](/services/websites/)[Infrastructure](/services/infrastructure/)[Partners](/partners/)

[Work](/work/)[Open source](/open-source/)[Knowledge base](/kb/)[About](/about/)

[About Avunu](/about/)[Team](/about/team/)[Insights](/insights/)[Contact](/contact/)

[Client portal](https://erp.avunu.net/projects)[Start a project](/start/)

- [Services](/services/)[Consulting](/services/consulting/)
- [ERP](/services/erp/)
- [Odoo](/services/erp/odoo/)
- [ERPNext](/services/erp/erpnext/)
- [Custom software](/services/custom-software/)
- [Devices & IoT](/services/devices-iot/)
- [Websites](/services/websites/)
- [Infrastructure](/services/infrastructure/)
- [Partners](/partners/)

[Work](/work/)[Open source](/open-source/)[Knowledge base](/kb/)[About](/about/)

- [About Avunu](/about/)
- [Team](/about/team/)
- [Insights](/insights/)
- [Contact](/contact/)

[Client portal](https://erp.avunu.net/projects)[Start a project](/start/)

UI Text Editor

Replaces the Quill editor behind every Text Editor field in the Frappe desk with the frappe-ui editor, keeping saved values compatible.

[Open source](/open-source/)

UI Text Editor

Frappe & ERPNext
Active
MIT

[View on GitHub (opens in a new tab)](https://github.com/Avunu/ui_text_editor)[Documentation (opens in a new tab)](https://docs.avunu.net/ui-text-editor/)

PlatformFrappe & ERPNext

LicenseMIT

StatusActive&#xA;

Repository[Avunu/ui_text_editor](https://github.com/Avunu/ui_text_editor)

Part of

Used in

Frappe's newer apps use a modern editor from frappe-ui, while the desk still edits long text in Quill. UI Text Editor brings the frappe-ui editor to every Text Editor field in the desk, so notes, descriptions, and email bodies get tables, check lists, and a cleaner toolbar. It's a drop-in swap: you change no DocTypes, and text saved by Quill opens as it was.

## Features

**Full toolbar.**
&#x20;Headings, bold, italic, underline, strike, inline code, text and highlight color, bullet, numbered, and check lists, indent, alignment, quotes, code blocks, horizontal rules, links, images, tables, undo, and redo.

**Context menus.**
&#x20;Selecting text shows a small formatting menu, and inside a table you get row and column controls.

**Image upload.**
&#x20;Paste, drop, or pick an image. It's uploaded as a public file, so it also shows in emails and web pages, and it's attached to the document once the document is saved.

**Compatible values.**
&#x20;Content is stored the way Quill stored it, and an empty editor saves an empty string, so print formats, emails, and read-only views are unaffected.

**Fits the desk.**
&#x20;Light and dark themes follow the desk, grid rows get a compact editor without the toolbar, and&#x20;
`max_height`
&#x20;is respected. The editor's styles are scoped so they can't leak into the rest of the page.

Mentions, emoji, slash commands, video, and embeds aren't included, and the comment box in the form timeline still uses Quill. The&#x20;
[README](https://github.com/Avunu/ui_text_editor#what-is-different-from-the-quill-editor)
&#x20;lists the differences from Quill.

## Getting started

Install the app and build its assets.

```
<span style="--shiki-dark:#FFA657;--shiki-light:#953800">bench</span><span style="--shiki-dark:#E6EDF3;--shiki-light:#1F2328"> </span><span style="--shiki-dark:#A5D6FF;--shiki-light:#0A3069">get-app</span><span style="--shiki-dark:#E6EDF3;--shiki-light:#1F2328"> </span><span style="--shiki-dark:#A5D6FF;--shiki-light:#0A3069">https://github.com/Avunu/ui_text_editor</span><span style="--shiki-dark:#E6EDF3;--shiki-light:#1F2328"> </span><span style="--shiki-dark:#79C0FF;--shiki-light:#0550AE">--branch</span><span style="--shiki-dark:#E6EDF3;--shiki-light:#1F2328"> </span><span style="--shiki-dark:#A5D6FF;--shiki-light:#0A3069">develop</span>
<span style="--shiki-dark:#FFA657;--shiki-light:#953800">bench</span><span style="--shiki-dark:#E6EDF3;--shiki-light:#1F2328"> </span><span style="--shiki-dark:#79C0FF;--shiki-light:#0550AE">--site</span><span style="--shiki-dark:#E6EDF3;--shiki-light:#1F2328"> </span><span style="--shiki-dark:#FF7B72;--shiki-light:#CF222E"><</span><span style="--shiki-dark:#A5D6FF;--shiki-light:#0A3069">SITE_NAM</span><span style="--shiki-dark:#E6EDF3;--shiki-light:#1F2328">E</span><span style="--shiki-dark:#FF7B72;--shiki-light:#CF222E">></span><span style="--shiki-dark:#E6EDF3;--shiki-light:#1F2328"> </span><span style="--shiki-dark:#A5D6FF;--shiki-light:#0A3069">install-app</span><span style="--shiki-dark:#E6EDF3;--shiki-light:#1F2328"> </span><span style="--shiki-dark:#A5D6FF;--shiki-light:#0A3069">ui_text_editor</span>
<span style="--shiki-dark:#FFA657;--shiki-light:#953800">bench</span><span style="--shiki-dark:#E6EDF3;--shiki-light:#1F2328"> </span><span style="--shiki-dark:#A5D6FF;--shiki-light:#0A3069">build</span><span style="--shiki-dark:#E6EDF3;--shiki-light:#1F2328"> </span><span style="--shiki-dark:#79C0FF;--shiki-light:#0550AE">--app</span><span style="--shiki-dark:#E6EDF3;--shiki-light:#1F2328"> </span><span style="--shiki-dark:#A5D6FF;--shiki-light:#0A3069">ui_text_editor</span>
```

Highlights

The frappe-ui (TipTap) editor in every Text Editor field, with no DocType changesTables, check lists, colors, links, and images from one toolbarPaste, drop, or upload images as public filesSaves values the way Quill did, so print formats and emails keep workingLight and dark themes that follow the desk

Related projects

[All open-source projects](/open-source/)

[ERPNext TaskView](/open-source/erpnext_taskview/)

Active&#xA;

A project and task workspace for ERPNext, with timers and hour budgets for staff and a portal where customers follow and work on their projects.

MIT[GitHub](https://github.com/Avunu/erpnext_taskview)

[ERPNext CIS Plus](/open-source/erpnext_cis_plus/)

Stable&#xA;

Simpler customer, contact, and address management for ERPNext, with address validation, geolocation, and a map of your customers.

MIT[GitHub](https://github.com/Avunu/erpnext_cis_plus)

[Automated Subscriptions](/open-source/automated_subscriptions/)

Active&#xA;

Automatic billing for ERPNext Subscriptions, with payment requests, billing anchors, proration, consolidated invoices, and credit notes.

MIT[GitHub](https://github.com/Avunu/automated_subscriptions)

Need help with it?

Need this implemented? Our ERPNext implementation team can install it and tune the desk for your team.

[Explore ERPNext implementation](/services/erp/erpnext/)[Start a project](/start/)

Services

- [ERP implementation](/services/erp/)
- [Odoo](/services/erp/odoo/)
- [ERPNext](/services/erp/erpnext/)
- [Custom software](/services/custom-software/)
- [Devices & IoT](/services/devices-iot/)
- [Websites](/services/websites/)
- [Infrastructure](/services/infrastructure/)

Resources

- [Our work](/work/)
- [Open source](/open-source/)
- [Knowledge base](/kb/)
- [Insights](/insights/)

Company

- [About](/about/)
- [Team](/about/team/)
- [Partners](/partners/)
- [Contact](/contact/)

Clients

- [Project portal](https://erp.avunu.net/projects)
- [Invoices](https://erp.avunu.net/)
- [Support](https://erp.avunu.net/)

[![Avunu](/brand/avunu-logo-light.svg)](/)[\<av-icon data-jx-static>\<svg viewBox="0 0 24 24" width="20" height="20" fill="currentColor" stroke="none" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false">\<path d="M20.400 20.500h-3.600v-5.600c0-1.300 0-3-1.800-3s-2.100 1.400-2.100 2.900v5.700H9.400V9h3.400v1.600c.5-.9 1.600-1.900 3.400-1.900 3.600 0 4.300 2.400 4.300 5.500v6.300zM5.300 7.400a2.100 2.100 0 1 1 0-4.100 2.100 2.100 0 0 1 0 4.100zm1.800 13.100H3.600V9h3.500v11.500zM22.200 0H1.800C.8 0 0 .8 0 1.700v20.600c0 .9.800 1.700 1.800 1.700h20.400c1 0 1.800-.8 1.800-1.700V1.700C24 .8 23.200 0 22.200 0z">\</path>\</svg>\</av-icon>](https://www.linkedin.com/company/avunu)[\<av-icon data-jx-static>\<svg viewBox="0 0 24 24" width="20" height="20" fill="currentColor" stroke="none" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false">\<path d="M12 .3a12 12 0 0 0-3.8 23.4c.6.1.8-.3.8-.6v-2c-3.3.7-4-1.6-4-1.6-.6-1.4-1.4-1.8-1.4-1.8-1-.7.1-.7.1-.7 1.2.1 1.8 1.2 1.8 1.2 1 1.8 2.8 1.3 3.5 1 .1-.8.4-1.3.7-1.6-2.7-.3-5.5-1.3-5.5-5.9 0-1.3.5-2.4 1.2-3.2-.1-.3-.5-1.5.1-3.2 0 0 1-.3 3.3 1.2a11.500 11.500 0 0 1 6 0c2.300-1.500 3.300-1.200 3.300-1.200.6 1.700.2 2.900.1 3.200.8.8 1.200 1.900 1.200 3.200 0 4.600-2.800 5.600-5.500 5.900.4.400.8 1.100.8 2.200v3.300c0 .3.2.7.8.6A12 12 0 0 0 12 .3">\</path>\</svg>\</av-icon>](https://github.com/Avunu)[Client portal](https://erp.avunu.net/projects)[Start a project](/start/)

Avunu LLC · 948 East Philadelphia Street, York, PA 17403 · (717) 814-8540Knowledge base articles are in the public domain[Privacy](/privacy/)[Terms](/terms/)
