# marked-highlight

> marked highlight

Latest version **2.2.4** (published 2026-04-07) · MIT license · 0 weekly downloads

## Install

```sh
npm install marked-highlight
pnpm add marked-highlight
yarn add marked-highlight
bun add marked-highlight
```

## Health

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

Positive: has types; esm support; no vulnerabilities; has provenance; high maintenance score; high quality score.

Warnings: low downloads.

## Facts

| | |
|---|---|
| Version | 2.2.4 |
| Published | 2026-04-07 |
| First published | 2023-03-31 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 17.8 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Provenance | attested (GitHub Actions) |
| GitHub stars | 132 |
| Author | Tony Brix |
| Maintainers | tonybrix |
| Keywords | marked, extension, highlight |

## Links

- npm: https://www.npmjs.com/package/marked-highlight
- Repository: https://github.com/markedjs/marked-highlight
- Homepage: https://github.com/markedjs/marked-highlight#readme
- Issues: https://github.com/markedjs/marked-highlight/issues
- npm.io page: https://npm.io/package/marked-highlight

## Alternatives

- [@oh-my-pi/pi-natives](https://npm.io/package/@oh-my-pi/pi-natives.md) — 51.8K weekly downloads
- [@capgo/capacitor-light-sensor](https://npm.io/package/@capgo/capacitor-light-sensor.md) — 3.0K weekly downloads
- [@heyhuynhgiabuu/pi-diff](https://npm.io/package/@heyhuynhgiabuu/pi-diff.md) — 492 weekly downloads
- [@lotsa/verdant-lang-asm](https://npm.io/package/@lotsa/verdant-lang-asm.md) — 38 weekly downloads
- [new-era-syntax](https://npm.io/package/new-era-syntax.md) — 20 weekly downloads

## Recent versions

- 2.2.4 (latest) — 2026-04-07
- 2.2.3 — 2025-11-07
- 2.2.2 — 2025-06-27
- 2.2.1 — 2024-11-09
- 2.2.0 — 2024-10-16
- 2.1.4 — 2024-08-07
- 2.1.3 — 2024-06-19
- 2.1.2 — 2024-06-12
- 2.1.1 — 2024-02-06
- 2.1.0 — 2023-12-15
- 2.0.9 — 2023-12-04
- 2.0.8 — 2023-11-30
- 2.0.7 — 2023-11-11
- 2.0.6 — 2023-09-11
- 2.0.5 — 2023-09-03
- … 8 more at https://npm.io/package/marked-highlight/versions

## README

# marked-highlight

Highlight code blocks

## Installation

```sh
npm install marked-highlight
```

## Usage

You will need to provide a function that transforms the `code` to html.

```js
import { Marked } from "marked";
import { markedHighlight } from "marked-highlight";
import hljs from 'highlight.js';

// or UMD script
// <script src="https://cdn.jsdelivr.net/npm/marked/lib/marked.umd.js"></script>
// <script src="https://cdn.jsdelivr.net/npm/marked-highlight/lib/index.umd.js"></script>
// const { Marked } = globalThis.marked;
// const { markedHighlight } = globalThis.markedHighlight;
const marked = new Marked(
  markedHighlight({
	emptyLangClass: 'hljs',
    langPrefix: 'hljs language-',
    highlight(code, lang, info) {
      const language = hljs.getLanguage(lang) ? lang : 'plaintext';
      return hljs.highlight(code, { language }).value;
    }
  })
);


marked.parse(`
\`\`\`javascript
const highlight = "code";
\`\`\`
`);
// <pre><code class="hljs language-javascript">
//   <span class="hljs-keyword">const</span> highlight = <span class="hljs-string">&quot;code&quot;</span>;
// </code></pre>
```

The `async` option should be set to `true` if the `highlight` function returns a `Promise`.

```js
import { Marked } from "marked";
import { markedHighlight } from "marked-highlight";
import pygmentize from 'pygmentize-bundled';

const marked = new Marked(
  markedHighlight({
    async: true,
    highlight(code, lang, info) {
      return new Promise((resolve, reject) => {
        pygmentize({ lang, format: 'html' }, code, function (err, result) {
          if (err) {
            reject(err);
            return;
          }

          resolve(result.toString());
        });
      });
    }
  })
)

await marked.parse(`
\`\`\`javascript
const highlight = "code";
\`\`\`
`);
// <pre><code class="language-javascript">
//   <div class="highlight">
//     <pre>
//       <span class="kr">const</span> <span class="nx">highlight</span> <span class="o">=</span> <span class="s2">&quot;code&quot;</span><span class="p">;</span>
//     </pre>
//   </div>
// </code></pre>
```

### `options`

| option |  type  | default | description |
|--------|--------|---------|:------------|
| async  | boolean | `false` | If the highlight function returns a promise set this to `true`. Don't forget to `await` the call to `marked.parse` |
| langPrefix | string | `'language-'` | A prefix to add to the class of the `code` tag. |
| emptyLangClass | string | `''` | The class to add to the `code` tag if the language is empty. |
| highlight | function | `(code: string, lang: string) => {}` | Required. The function to transform the code to html. |

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