Help & Documentation

Learn how to use the Markdown Editor with LaTeX and Mermaid support

Overview

This is a professional online editor that combines three powerful markup languages: Markdown for formatting, LaTeX for mathematical equations, and Mermaid for diagrams. Export your work to PDF with a single click.

Key Features

Markdown Support

Full markdown syntax including headings, lists, links, images, code blocks, and blockquotes with live preview.

LaTeX Math

Write complex mathematical equations using LaTeX syntax. Supports both inline and block equations.

Mermaid Diagrams

Create flowcharts, sequence diagrams, Gantt charts, and more using simple text-based syntax.

PDF Export

Export your documents to PDF format with proper formatting, preserving all styling and content.

Themes & Styles

Choose between light and dark themes, multiple preview styles, and adjustable font sizes.

Syntax Highlighting

Code blocks feature beautiful syntax highlighting for multiple programming languages.

Markdown Syntax

Headings

# Heading 1
## Heading 2
### Heading 3

Text Formatting

**bold text**
*italic text*
~~strikethrough~~
`inline code`

Lists

1. Ordered item
2. Another item

- Unordered item
- Another item

Links & Images

[Link text](https://example.com)
![Alt text](image-url.jpg)

Code Blocks

```javascript
function hello() {
  console.log("Hello!");
}
```

LaTeX Math Equations

Inline Math

Use single dollar signs for inline equations:

The formula $E = mc^2$ is famous.

Block Math

Use double dollar signs for block equations:

$$
x = \frac{-b \pm \sqrt{b^2 - 4ac}}{2a}
$$

Common LaTeX Symbols

\alpha, \beta, \gamma  (Greek letters)
\sum, \int, \prod  (Operators)
\frac{a}{b}  (Fractions)
\sqrt{x}  (Square root)
x^2, x_i  (Superscript, subscript)

Mermaid Diagrams

Flowchart

```mermaid
graph TD
    A[Start] --> B{Decision}
    B -->|Yes| C[Action 1]
    B -->|No| D[Action 2]
```

Sequence Diagram

```mermaid
sequenceDiagram
    Alice->>John: Hello John!
    John-->>Alice: Hi Alice!
```

Gantt Chart

```mermaid
gantt
    title Project Timeline
    section Phase 1
    Task 1: 2024-01-01, 30d
    Task 2: 2024-02-01, 20d
```

Tips & Tricks

  • •Use the live preview to see your changes in real-time as you type
  • •Switch between themes to find the most comfortable editing environment
  • •Adjust font size for better readability during long editing sessions
  • •Try different preview styles (Default, GitHub, Minimal) to match your document's purpose
  • •Export to PDF when you're ready to share or print your document

Made with ❤️ by adgstudios