# typecellos/blocknote

**Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/typecellos-blocknote).**

9,141 stars · 687 forks · TypeScript · other

## Links

- GitHub: https://github.com/TypeCellOS/BlockNote
- Homepage: https://www.blocknotejs.org/
- awesome-repositories: https://awesome-repositories.com/repository/typecellos-blocknote.md

## Topics

`block-based` `editor` `javascript` `notion` `notion-editor` `prosemirror` `react` `rich-text-editor` `tiptap` `typescript` `wysiwyg` `yjs`

## Description

BlockNote is a block-based rich text editor and a real-time collaborative workspace. It uses a JSON-based data model to organize content into draggable, nestable blocks rather than a single flat document. The system functions as a high-level interface built on ProseMirror that abstracts document state into discrete, manipulatable content blocks.

The project serves as a framework for integrating large language models into document editors, enabling context-aware text generation and AI-driven workflows. It also acts as a document export engine capable of converting structured block data into formats such as HTML, Markdown, PDF, and Word.

The editor supports real-time collaboration with automatic synchronization, conflict resolution, and inline discussion threads. Additional capabilities include custom block schema configuration, media file uploads to remote storage, and a pluggable synchronization layer for maintaining state across multiple users.

## Tags

### Content Management & Publishing

- [Block-Based Document Models](https://awesome-repositories.com/f/content-management-publishing/content-management-systems/content-architecture-modeling/document-architectures/block-based-document-models.md) — Uses a block-based document model where content is organized as discrete, nestable JSON objects.
- [Rich Text Editors](https://awesome-repositories.com/f/content-management-publishing/authoring-editorial-interfaces/rich-text-editors.md) — Provides a block-based rich text interface that can be embedded as a content creation component within applications. ([source](https://cdn.jsdelivr.net/gh/typecellos/blocknote@main/README.md))
- [Document Format Converters](https://awesome-repositories.com/f/content-management-publishing/content-processing-transformation/document-processing-conversion/document-processing/format-specific-parsers/office-document-parsers/document-format-converters.md) — Converts internal block-based JSON data into formats such as Markdown, PDF, and Word.
- [AI Content Generation](https://awesome-repositories.com/f/content-management-publishing/media-management/media-automation-tools/document-generation/ai-content-generation.md) — Integrates large language models to generate, refine, and transform document text using custom prompts.
- [Threaded Discussion Interfaces](https://awesome-repositories.com/f/content-management-publishing/threaded-discussion-interfaces.md) — Provides persistent, threaded discussion interfaces for users to leave comments throughout a document. ([source](https://www.blocknotejs.org/examples))
- [Document Exporting](https://awesome-repositories.com/f/content-management-publishing/content-formats-exporting/document-exporting.md) — Converts structured block data into downloadable PDF, Word, and ODT file formats. ([source](https://www.blocknotejs.org/))
- [Document Conversion](https://awesome-repositories.com/f/content-management-publishing/content-processing-transformation/document-processing-conversion/document-conversion.md) — Transforms structured block content into various standard file formats for external distribution.
- [Format Conversion Toolkits](https://awesome-repositories.com/f/content-management-publishing/content-processing-transformation/document-processing-conversion/document-processing-tools/format-conversion-toolkits.md) — Provides toolkits for transforming internal block data into HTML, Markdown, PDF, and other interoperable formats. ([source](https://www.blocknotejs.org/examples))

### User Interface & Experience

- [Content Block Editors](https://awesome-repositories.com/f/user-interface-experience/content-block-editors.md) — Implements a rich text editor based on draggable and nestable content blocks. ([source](https://www.blocknotejs.org/))
- [Structured Block Renderers](https://awesome-repositories.com/f/user-interface-experience/content-rendering-components/structured-block-renderers.md) — Renders the editor interface by mapping defined block schemas to specific UI components.
- [Rich Text Editors](https://awesome-repositories.com/f/user-interface-experience/rich-text-editors.md) — Built upon a headless rich text engine to manage document schemas and low-level text manipulation.
- [Collaborative Discussion Threads](https://awesome-repositories.com/f/user-interface-experience/text-highlighting/document-annotators/collaborative-discussion-threads.md) — Implements inline discussion threads and user mentions for real-time team communication within the document.
- [Editor Extensions](https://awesome-repositories.com/f/user-interface-experience/editor-extensions.md) — Extends editor functionality via custom block types, inline content, and tailored menu systems. ([source](https://www.blocknotejs.org/))
- [AI Menu Items](https://awesome-repositories.com/f/user-interface-experience/menu-integration-apis/ai-menu-items.md) — Integrates AI-powered commands directly into the editor's menu system for seamless text transformation. ([source](https://www.blocknotejs.org/examples))

### Artificial Intelligence & ML

- [Generative AI](https://awesome-repositories.com/f/artificial-intelligence-ml/generative-ai-resources/generative-ai.md) — Implements generative AI capabilities to create and modify document content via custom prompts. ([source](https://www.blocknotejs.org/docs/features/ai))
- [LLM Integration Frameworks](https://awesome-repositories.com/f/artificial-intelligence-ml/llm-integration-frameworks.md) — Serves as a framework for connecting language models to document editors for context-aware generation.
- [Generative AI Integration Layers](https://awesome-repositories.com/f/artificial-intelligence-ml/generative-ai-integration-layers.md) — Implements a transport layer that routes AI prompt and response streams into the editor state.
- [Multi-Model Workflow Coordinators](https://awesome-repositories.com/f/artificial-intelligence-ml/multi-model-workflow-coordinators.md) — Coordinates multi-step AI interactions and workflows using external knowledge and human guidance. ([source](https://www.blocknotejs.org/docs/features/ai))

### Business & Productivity Software

- [Collaborative Document Annotations](https://awesome-repositories.com/f/business-productivity-software/collaborative-document-annotations.md) — Embeds inline discussion threads and user mentions directly within the document for contextual team communication. ([source](https://www.blocknotejs.org/))
- [Collaborative Editors](https://awesome-repositories.com/f/business-productivity-software/team-collaboration-events/collaboration-communication-tools/collaboration-software/collaborative-editors.md) — Provides a real-time collaborative workspace with state synchronization and concurrent editing capabilities.
- [Real-time Collaboration](https://awesome-repositories.com/f/business-productivity-software/team-collaboration-events/collaboration-communication-tools/collaboration-tools/real-time-collaboration.md) — Enables simultaneous multi-user editing and content sharing through real-time synchronization. ([source](https://www.blocknotejs.org/demo))

### Data & Databases

- [JSON Document Manipulation](https://awesome-repositories.com/f/data-databases/json-document-stores/json-document-manipulation.md) — Enables programmatic control of the editor state by manipulating document content as JSON objects. ([source](https://www.blocknotejs.org/examples))
- [Sync Provider Abstractions](https://awesome-repositories.com/f/data-databases/data-processing-pipelines/data-processing/dataframe-processing/agnostic-interfaces/provider-abstraction-layers/sync-provider-abstractions.md) — Provides a pluggable synchronization layer that abstracts the communication between the editor and external sync services.
- [AI Text Refinement Pipelines](https://awesome-repositories.com/f/data-databases/text-processing-utilities/text-processing-tools/ai-text-refinement-pipelines.md) — Provides AI-driven refinement pipelines for formatting and improving the quality of document text. ([source](https://www.blocknotejs.org/))

### Networking & Communication

- [Conflict-Free Replicated Data Types](https://awesome-repositories.com/f/networking-communication/distributed-systems-p2p/synchronization-strategies/conflict-free-replicated-data-types.md) — Utilizes conflict-free replicated data types (CRDTs) to ensure consistent state across real-time collaborators.

### Web Development

- [Collaborative Editing Conflict Resolution](https://awesome-repositories.com/f/web-development/collaborative-editing-conflict-resolution.md) — Coordinates concurrent edits with automatic conflict resolution to support real-time collaboration. ([source](https://www.blocknotejs.org/))
- [Collaborative Editing Frameworks](https://awesome-repositories.com/f/web-development/collaborative-editing-frameworks.md) — Provides the synchronization infrastructure and conflict resolution required for simultaneous multi-user editing.
- [State Synchronization](https://awesome-repositories.com/f/web-development/state-synchronization.md) — Maintains document state consistency across multiple users via external synchronization providers. ([source](https://www.blocknotejs.org/examples))

### Software Engineering & Architecture

- [Visual Block Schemas](https://awesome-repositories.com/f/software-engineering-architecture/configuration-driven-schemas/visual-block-schemas.md) — Allows developers to define custom block types and visual properties through configuration-driven schemas. ([source](https://www.blocknotejs.org/examples))