explaingit

facebook/lexical

📈 Trending23,419TypeScriptAudience · developerComplexity · 3/5ActiveLicenseSetup · easy

TLDR

A TypeScript framework for building customizable rich-text editors in web apps. Assemble plugins to create editors like Notion or Google Docs.

Mindmap

mindmap
  root((Lexical))
    What it does
      Rich-text editor
      Plugin-based
      Immutable state
      Undo and redo
    Tech stack
      TypeScript
      React bindings
      Yjs integration
      npm package
    Use cases
      CMS platforms
      Note-taking apps
      Collaborative editing
      Chat with formatting
    Key features
      Framework-agnostic
      Real-time sync
      Custom behavior
      Modular design

Things people build with this

USE CASE 1

Build a collaborative note-taking app where multiple users can edit the same document in real time.

USE CASE 2

Create a CMS with a custom rich-text editor that matches your brand's design and feature set.

USE CASE 3

Add a formatted chat or comment system to your web app with bold, lists, and link support.

USE CASE 4

Develop a Notion-like workspace with tables, embeds, and undo/redo powered by an immutable state model.

Tech stack

TypeScriptReactYjsnpm

Getting it running

Difficulty · easy Time to first run · 5min
MIT license, use freely for any purpose, including commercial, as long as you include the copyright notice.

In plain English

Lexical is a toolkit for building text editors inside web applications. If you have ever wondered how apps like Notion, Google Docs, or a blog platform create their rich-text editing boxes, where you can bold text, add lists, insert images, and undo mistakes, Lexical is the kind of building block that powers those experiences. Rather than a finished editor you drop in, Lexical is a framework: a set of low-level pieces developers assemble into whatever editor they need. It is plugin-based, meaning features like spell check, tables, or collaborative editing are added modularly rather than baked in. The core is framework-agnostic, though official bindings exist for React. A key concept is its immutable state model, every change in the editor creates a new snapshot of the document state. This makes undo and redo reliable and also opens the door to real-time collaboration (multiple people editing the same document simultaneously), which it supports through integration with a library called Yjs. You would use Lexical when you are building a web product that needs a text editor, a CMS, a note-taking app, a chat tool with formatting, and you want full control over how that editor behaves rather than being locked into a third-party widget. It is written in TypeScript, published on npm, and created by Meta (Facebook).

Copy-paste prompts

Prompt 1
Show me how to set up Lexical in a React app and create a basic editor with bold and italic buttons.
Prompt 2
How do I add collaborative editing to a Lexical editor using Yjs so multiple users can edit at once?
Prompt 3
Walk me through building a custom plugin for Lexical that adds a table feature to the editor.
Prompt 4
What is the immutable state model in Lexical and how does it make undo/redo work reliably?
Prompt 5
How do I style and customize the appearance of a Lexical editor to match my app's design?
Open on GitHub → Explain another repo

Generated 2026-05-18 · Model: sonnet-4-6 · Verify against the repo before relying on details.