Extensions Guide

Learn how to extend Marked with custom syntax and rendering.

Overview

Marked supports four types of extensions:

1. Tokenizer Extensions: Add new markdown syntax
2. Renderer Extensions: Customize HTML output
3. Hooks: Intercept processing pipeline
4. walkTokens: Process all tokens globally

Quick Example

import { marked } from "marked";

// Add custom emoji syntax
marked.use({
  extensions: [{
    name: 'emoji',
    level: 'inline',
    start(src) { return src.indexOf(':'); },
    tokenizer(src) {
      const match = src.match(/^:([a-z_]+):/);
      if (match) {
        return { type: 'emoji', raw: match[0], name: match[1] };
      }
    },
    renderer(token) {
      return `<span class="emoji emoji-${token.name}"></span>`;
    }
  }]
});

const html = marked.parse('Hello :wave:!');

Detailed Documentation

For complete extension system documentation, see:

• Extension System Reference

Common Extension Patterns

Custom Syntax

• Emoji support
• Wiki-style links
• Math expressions
• Custom alert blocks

Custom Rendering

• Syntax highlighting
• Custom heading anchors
• External link handling
• Image optimization

Token Processing

• Table of contents generation
• Heading ID generation
• Link validation
• Metadata extraction

See Real-World Scenarios for complete examples.