MD/MDX Viewer — Comfortable MD File Viewer
A single, lightweight, and independent HTML file (~188 KB) designed to comfortably display and compare MarkDown (MD) and MDX files directly in your browser. The tool was created out of a simple need: to comfortably view these MD files without installing complex environments, setting up local servers, or uploading private files to the cloud. It can run directly from the web or work 100% offline.
Key Features
| Feature | Benefit |
|---|---|
| Format Support | Works seamlessly with .md and .mdx. For MDX, JSX tags are displayed as visual labels. |
| Dual Pane Comparison | View a single MD file or two files side-by-side. Perfect for comparing versions or translations. |
| Smart Drag & Drop | Simply drag MD files into the browser. You can drag two files together, and they will automatically open side-by-side. |
| Direction Control (RTL/LTR) | Each pane has an independent direction button for Hebrew MD files. |
| Scroll Sync | In dual-pane mode, align the pages so they match up, then click "Scroll Sync". Both panes will scroll together in full sync. |
| Reload | Edited the original MD file externally? Click ↻ Reload and the changes reflect immediately. |
| Useful Tools | Word count, Syntax Highlighting, and Dark/Light mode. |
Quick Start Guide
The tool is very intuitive and ready for immediate action:
Option A: Run Directly from Browser
Visit the Project's GitHub Pages and start working.
Option B: Offline Work (Download)
- Download: Download the index.html file.
- Open: Double-click the downloaded file.
- Loading MD Files: Drag an MD file into the window. You can load or drag two files together — they will open instantly in both panes (side-by-side). If you select more than two, the system will only load the first two.
- Day-to-day Use & Sync:
- Change the pane ratio by dragging the divider (double-click to reset to 50/50).
- Scroll Sync: Align the text in both panes so they are matched up, then click the "Scroll Sync" button at the top right. You can now scroll both files together.
- Use the RTL button for each side independently if needed.