📝 Welcome To MarkdownToPDF.tech

A powerful and beautiful markdown editor with live preview and synchronized scrolling.

✨ All Supported Features

• Live preview with synchronized scrolling

• Line numbers in editor

• Resizable split panels (drag the divider!)

• Syntax highlighting for code blocks

• Mathematical expressions (LaTeX/KaTeX)

• Inline math ($...$) and display math (
  $$...$$
  )

• Nested lists (bullets, numbers, letters, roman numerals)

• Task lists with checkboxes

• Tables with column alignment

• Images with responsive sizing

• Footnotes with backreferences

• Strikethrough text

• Inline HTML support

• HTML comments (invisible in preview)

• Definition lists

• Autolinks for URLs and emails

• Escape characters

• More features coming soon!

---

📚 Text Formatting Examples

Basic Formatting

Bold text using text or __text__

Italic text using text or _text_

Strikethrough text using text

Underlined text using HTML text

Code

Inline code using backticks: const x = 42;

Combinations

You can combine: bold and italic together, or bold strikethrough, or even bold italic.

---

📋 All List Types

1. Bullet Lists

• First level item

• Another first level
• Second level nested
• More second level
• Third level nested
• Deep nesting works!

• Back to first level

2. Numbered Lists

• First item

• Second item

• Third item
• Nested numbered item
• Another nested item

• Fourth item

3. Custom Numbering

• Start at five

• Jump to ten

• Skip to fifteen

• Custom numbers preserved!

4. Letter Lists (Lowercase)

• Option alpha

• Option beta

• Option gamma
• Nested letter list
• More nested letters

• Option delta

5. Letter Lists (Uppercase)

• First capital

• Second capital

• Third capital

6. Roman Numerals

• First point

• Second point

• Third point

• Fourth point

• Fifth point

7. Task Lists (Interactive Checkboxes)

• Completed task (checkbox is green!)

• Design user interface

• Write documentation

• Implement backend API

• Write unit tests

• Deploy to production

• Setup CI/CD pipeline

• Performance optimization

8. Mixed Nested Lists

• Main project goal
• Sub-goal A
• Sub-goal B
• Detail 1
• Detail 2

• Second project goal
• Step one
• Step two

• Third project goal

---

💻 Code Blocks

JavaScript

javascript
// JavaScript with syntax highlighting
function fibonacci(n) {
  if (n <= 1) return n;
  return fibonacci(n - 1) + fibonacci(n - 2);
}

const result = fibonacci(10);
console.log(`Fibonacci(10) = ${result}`);

Python

python
# Python with syntax highlighting
def quicksort(arr):
    if len(arr) <= 1:
        return arr
    pivot = arr[len(arr) // 2]
    left = [x for x in arr if x < pivot]
    middle = [x for x in arr if x == pivot]
    right = [x for x in arr if x > pivot]
    return quicksort(left) + middle + quicksort(right)

print(quicksort([3, 6, 8, 10, 1, 2, 1]))

TypeScript

typescript
// TypeScript with type annotations
interface User {
  id: number;
  name: string;
  email: string;
}

function getUser(id: number): Promise<User> {
  return fetch(`/api/users/${id}`).then(res => res.json());
}

---

📊 Tables

Basic Table

Feature	Status	Priority	Notes
Live Preview	✅ Complete	High	Real-time rendering
Line Numbers	✅ Complete	High	Synchronized with content
Tables	✅ Complete	Medium	Full markdown support
Images	✅ Complete	Medium	Responsive & styled
Footnotes	✅ Complete	Low	With backreferences

Table with Column Alignment

Left Aligned	Center Aligned	Right Aligned
Left	Center	Right
A	B	C
1	2	3
Text	🎨	100%

Project Timeline Table

Phase	Task	Status	Due Date
Planning	Requirements	✅	Jan 15
Design	Mockups	✅	Feb 1
Development	Backend API	🚧	Mar 1
Testing	QA Testing	⏳	Mar 15

---

📖 Definition Lists

Programming Terms:

API

Application Programming Interface - a set of protocols for building software

REST

Representational State Transfer - an architectural style for web services

JSON

JavaScript Object Notation - a lightweight data interchange format

Markdown Terms:

Syntax

The rules that define the structure of markdown

Parser

A program that converts markdown text to HTML

Preview

Live rendering of formatted text

---

🖼️ Images

Images are supported with responsive sizing:

---

💬 Blockquotes

Simple Quote

"The best way to predict the future is to invent it." — Alan Kay

Nested Blockquotes

First level blockquote

Second level nested quote

Third level deeply nested

Multiple paragraphs in nested quotes work too!

Back to second level

Back to first level

Quote with Code

You can include code in quotes:

const message = "Hello World";

And even bold or italic text!

---

🔗 Links and Autolinks

Regular Links

GitHub | Markdown Guide | Next.js

Check out the official documentation for more details.

Autolinks (URLs)

Visit https://example.com for more information.

Documentation: https://docs.example.com

Autolinks (Emails)

Contact us: user@example.com

Support: support@example.com

---

📎 Footnotes

Here's a sentence with a footnote^[1]. You can add multiple footnotes^[2] throughout your document. The same footnote can be referenced multiple times^[1].

Complex information can be explained in footnotes^[3] without cluttering the main text.

---

🎨 Inline HTML Elements

Line Breaks

First line
Second line
Third line

Text Styling

Underlined text for emphasis

Small text for fine print

Highlighted text (if supported)

Block Elements

Click to expand for more details

This is hidden content that appears when you click the summary!

• Item 1
• Item 2

HTML Comments

The comments above are invisible in the rendered output.

---

😎 Emojis

Unicode Emojis

Direct Unicode: 😀 😃 😄 😁 🎉 🚀 ⭐ ❤️ 💡 🔥

Emoji Shortcodes

Using :emoji: syntax: 😊 ❤️ 👍 🔥 🚀 ⭐ ✅ ❌ ⚠️ ℹ️ 📖 💡 😎 🎉

---

🛡️ Escape Characters

Escaping Special Characters

*This text has literal asterisks* and won't be italic.

[This is not a link](https://example.com)

# This is not a header

Use backslash \ to show a backslash: \

Common Escapes

You Type	You See
\	\
*	*
_	_
#	#
[ ]	[ ]
( )	( )

---

🎯 Horizontal Rules

You can create horizontal rules with three or more hyphens, asterisks, or underscores:

---

Three hyphens above

---

Three asterisks above

---

Three underscores above

---

🚀 Pro Tips

• Drag the divider between editor and preview to resize panels

• Scroll synchronization keeps editor and preview aligned

• Line numbers help you track your position in large documents

• Syntax highlighting makes code blocks easy to read

• Task lists are perfect for TODO lists and project tracking

• Tables support left, center, and right alignment

• Nested lists can go as deep as you need

• HTML comments let you add notes without showing in preview

---

💡 Quick Reference

markdown
# Headers: # H1, ## H2, ### H3
**Bold** or __Bold__
*Italic* or _Italic_
~~Strikethrough~~
`inline code`
[Link](url)
![Image](url)
> Blockquote
- Bullet list
1. Numbered list
- [ ] Task list
| Table | Header |

---

🔢 Mathematical Expressions

Inline Math

The quadratic formula is $x = \frac{-b \pm \sqrt{b^2 - 4ac}}{2a}$ where $a \neq 0$.

Einstein's famous equation: $E = mc^2$ relates energy and mass.

The pythagorean theorem: $a^2 + b^2 = c^2$ is fundamental in geometry.

For complex numbers: $z = a + bi$ where $i = \sqrt{-1}$.

Display Math (Centered)

Euler's Identity:

Sum Notation:

Integral:

Matrix:

Greek Letters:

Advanced Examples

Binomial Theorem:

Calculus - Derivative:

Statistics - Normal Distribution:

Linear Algebra - Determinant:

Set Theory:

Logic Operators:

Fractions and Roots:

Trigonometry:

Limits:

Partial Derivatives:

---

🎉 Happy Writing!

Start editing in the left panel to see your changes in real-time!

Remember: All your markdown features are working perfectly! 🚀

---