Markdown Previewer

Features

• Bold text and italic text
• inline code
• Links
• Strikethrough

Code Blocks with Syntax Highlighting

JavaScript

function greet(name) {
  return `Hello, ${name}!`;
}

const user = "World";
console.log(greet(user));

Python

def fibonacci(n):
    if n <= 1:
        return n
    return fibonacci(n-1) + fibonacci(n-2)

print(fibonacci(10))

CSS

.container {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
}

.button {
  background: linear-gradient(45deg, #ff6b6b, #4ecdc4);
  border: none;
  padding: 12px 24px;
  border-radius: 8px;
  color: white;
  cursor: pointer;
}

JSON

{
  "name": "John Doe",
  "age": 30,
  "email": "john@example.com",
  "skills": ["JavaScript", "React", "Node.js"]
}

SQL

SELECT u.name, u.email, p.title
FROM users u
JOIN posts p ON u.id = p.user_id
WHERE u.active = true
ORDER BY p.created_at DESC;

TypeScript

interface User {
  id: number;
  name: string;
  email: string;
  active: boolean;
}

function createUser(userData: Partial<User>): User {
  return {
    id: Date.now(),
    name: userData.name || 'Anonymous',
    email: userData.email || '',
    active: userData.active ?? true,
  };
}

Lists

• Item 1
• Item 2
  • Nested item
  • Another nested item
• Item 3

Numbered List

1. First step
2. Second step
3. Third step

Blockquotes

This is a blockquote It can span multiple lines

Tables

Name	Age	City
Alice	25	New York
Bob	30	London
Carol	35	Tokyo

Task List

• Complete setup
• Add syntax highlighting
• Write documentation
• Add tests