How to Use

  • Write Markdown: Type or edit Markdown text in the left textarea (e.g., # Heading, bold, * list item).

  • View Preview: The formatted HTML output appears in real-time on the right.

  • Supported Markdown: Includes headers, lists, bold, italic, links, images, code blocks, and more (via the marked library).

  • Sample Content: The editor starts with sample Markdown to demonstrate usage.

Features

  • Responsive Design: Uses Tailwind CSS for a clean, mobile-friendly interface (split-screen on desktop, stacked on mobile).

  • Real-Time Preview: Updates the preview instantly as you type.

  • Markdown Support: Parses common Markdown syntax using the marked library.

  • Scrollable Preview: The preview area is scrollable for long content.

  • Prose Styling: Uses Tailwind's prose class for clean, readable typography in the preview.