# @lexical/html

> This package contains HTML helpers and functionality for Lexical.

Latest version **0.51.0** (published 2026-09-17) · MIT license · 0 weekly downloads

## Install

```sh
npm install @lexical/html
pnpm add @lexical/html
yarn add @lexical/html
bun add @lexical/html
```

## Health

**Score 75/100 (B)** — status: active.

Positive: has types; esm support; no vulnerabilities; has provenance; recently updated; high maintenance score; popular repo.

Warnings: low downloads; pre 1.0.

## Facts

| | |
|---|---|
| Version | 0.51.0 |
| Published | 2026-09-17 |
| First published | 2022-06-02 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 5 |
| Unpacked size | 423.1 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Provenance | attested (GitHub Actions) |
| GitHub stars | 23876 |
| Maintainers | fantactuka, zurfyx, acywatson, ipavlov001, trueadm, etrepum |
| Keywords | lexical, editor, rich-text, html |

## Links

- npm: https://www.npmjs.com/package/@lexical/html
- Repository: https://github.com/facebook/lexical
- npm.io page: https://npm.io/package/@lexical/html

## Dependencies (5)

- [lexical](https://npm.io/package/lexical.md) 0.51.0
- [@lexical/utils](https://npm.io/package/@lexical/utils.md) 0.51.0
- [@lexical/internal](https://npm.io/package/@lexical/internal.md) 0.51.0
- [@lexical/extension](https://npm.io/package/@lexical/extension.md) 0.51.0
- [@lexical/selection](https://npm.io/package/@lexical/selection.md) 0.51.0

## Alternatives

- [@tsparticles/shape-image](https://npm.io/package/@tsparticles/shape-image.md) — 303.7K weekly downloads
- [@tsparticles/shape-line](https://npm.io/package/@tsparticles/shape-line.md) — 233.7K weekly downloads
- [stringify-attributes](https://npm.io/package/stringify-attributes.md) — 58.6K weekly downloads
- [mobile-drag-drop](https://npm.io/package/mobile-drag-drop.md) — 46.3K weekly downloads
- [@comunica/actor-rdf-parse-html](https://npm.io/package/@comunica/actor-rdf-parse-html.md) — 29.2K weekly downloads

## Recent versions

- 0.51.0 (latest) — 2026-09-17
- 0.51.1-nightly.20260921.0 (nightly) — 2026-09-21
- 0.45.1-dev.0 (dev) — 2026-05-30
- 0.6.1-next.0 (next) — 2022-11-04
- 0.51.1-nightly.20260918.0 — 2026-09-18
- 0.50.1-nightly.20260917.0 — 2026-09-17
- 0.50.1-nightly.20260916.0 — 2026-09-16
- 0.50.1-nightly.20260915.0 — 2026-09-15
- 0.50.1-nightly.20260914.0 — 2026-09-14
- 0.50.1-nightly.20260911.0 — 2026-09-11
- 0.50.1-nightly.20260910.0 — 2026-09-10
- 0.50.1-nightly.20260909.0 — 2026-09-09
- 0.50.1-nightly.20260908.0 — 2026-09-08
- 0.50.1-nightly.20260907.0 — 2026-09-07
- 0.50.1-nightly.20260904.0 — 2026-09-04
- … 655 more at https://npm.io/package/@lexical/html/versions

## README

# `@lexical/html`

[![See API Documentation](https://lexical.dev/img/see-api-documentation.svg)](https://lexical.dev/docs/api/modules/lexical_html)

# HTML
This package exports utility functions for converting `Lexical` -> `HTML` and `HTML` -> `Lexical`. These same functions are also used in the `lexical-clipboard` package for copy and paste.

[Full documentation can be found here.](https://lexical.dev/docs/concepts/serialization)

### Exporting
```js
// In a headless mode, you need to initialize a headless browser implementation such as JSDom.
const dom = new JSDOM();
// @ts-expect-error
global.window = dom.window;
global.document = dom.window.document;
// You may also need to polyfill DocumentFragment or navigator in certain cases.

// When converting to HTML you can pass in a selection object to narrow it
// down to a certain part of the editor's contents.
const htmlString = $generateHtmlFromNodes(editor, selection | null);
```

### Importing
First we need to parse the HTML string into a DOM instance.
```js
// In the browser you can use the native DOMParser API to parse the HTML string.
const parser = new DOMParser();
const dom = parser.parseFromString(htmlString, textHtmlMimeType);

// In a headless environment you can use a package such as JSDom to parse the HTML string.
const dom = new JSDOM(htmlString);
```
And once you have the DOM instance.
```js
const nodes = $generateNodesFromDOM(editor, dom);

// Once you have the lexical nodes you can initialize an editor instance with the parsed nodes.
const editor = createEditor({ ...config, nodes });

// Or insert them at a selection.
$insertNodes(nodes);
```

---
_Source: https://npm.io/package/@lexical/html · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._