Welcome to SynclineMDX Playground

This is an interactive playground for the @synclineapi/mdx-editor npm package.

Features

• 33+ built-in plugins covering formatting, code, media, and more
• Framework-agnostic — works with React, Vue, Angular, or vanilla JS
• Live markdown preview with scroll sync

Code Example

``typescript import { createEditor } from '@synclineapi/mdx-editor';

const editor = createEditor({ container: '#editor', value: '# Hello World', plugins: ['heading', 'bold', 'italic', 'code-block'], }); ``

Table

Plugin

Category | Description | ----------|-------------|

heading

Formatting | H1–H6 headings |

bold

Formatting | Bold text |

code-block

Code | Fenced code blocks |

table

Layout | GFM tables |

Blockquote

SynclineMDX: zero lock-in, 33+ plugins, ships in minutes.

Task List

☑ Install the package

☑ Configure plugins

☐ Customise the theme

☐ Build something great

---

Edit the markdown on the left and see the live preview on the right.