Standard Markdown is fantastic for writing basic text, lists, and links. But if you are a technical writer, engineer, or data scientist, you quickly run into its limitations. What happens when you need to draw a system architecture flowchart or write a complex LaTeX equation?
This is where standard Markdown falls short, forcing writers to create diagrams in external tools, export them as images, and embed them. If the diagram needs an update, the whole process must be repeated.
Enter Markdown Studio
The Markdown Studio inside JSON OS was built to solve this exact problem. It is a live-rendering Markdown editor that runs completely in your browser, and it natively supports both Mermaid.js and KaTeX.
Drawing Diagrams with Mermaid
Mermaid is a JavaScript-based diagramming and charting tool that renders Markdown-inspired text definitions to create and modify diagrams dynamically.
To use it in our editor, simply start a fenced code block and specify mermaid as the language:
```mermaid
graph TD;
A[Client]-->B[Load Balancer];
B-->C[Server 1];
B-->D[Server 2];
```The editor will instantly render this as a beautiful, theme-aware SVG diagram right beside your text.
Writing Math with KaTeX
If you need to include mathematical formulas, standard Markdown won't help you. JSON OS integrates KaTeX, an incredibly fast math typesetting library for the web.
You can write inline equations by wrapping your LaTeX syntax in single dollar signs $E = mc^2$, or create block-level equations using double dollar signs:
$$
f(x) = \int_{-\infty}^\infty \hat f(\xi)\,e^{2 \pi i \xi x} \,d\xi
$$Everything Stays on Your Machine
The best part about the Markdown Studio? It requires no server backends, no image hosting, and no accounts. Your documents are automatically saved to your browser's IndexedDB. When you're finished, you can export your entire document—diagrams, math, and all—into a single, portable HTML file.