A simple and powerful web application that converts Markdown text into high-quality images, perfectly optimized for sharing on social media platforms (SNS) like X (formerly Twitter), Instagram, and more.
Demo: https://freddiefujiwara.com/md2img/
- Markdown Support: Easily format your content using standard Markdown (Bold, Italic, Tables, Code blocks, etc.).
- Auto-Pagination: Long text is automatically split into multiple pages/images.
- High Resolution: Exports as high-resolution PNG images (Scale: 2) for crisp quality on all devices.
- State Persistence: Your Markdown content is saved in the URL, making it easy to share or bookmark.
- Mobile Friendly: Fully responsive design for creating images on the go.
- Privacy Focused: All conversion happens in your browser. No data is sent to a server.
- Framework: Vue 3 (Composition API)
- Build Tool: Vite
- Styling: Tailwind CSS 4
- Markdown Parsing: marked
- Image Generation: html2canvas
- URL Compression: lz-string
- Open the app: Visit the demo link or run it locally.
- Write Markdown: Type or paste your content into the editor.
- Preview: See the real-time preview of how your images will look.
- Export: Click the download button to save your content as PNG images.
- Node.js (LTS recommended)
```bash npm install ```
```bash npm run dev ```
Open the URL that Vite prints (usually `http://localhost:5173/md2img/\`).
```bash npm run test ```
```bash npm run build ```
The production-ready files will be in the `dist/` directory.
```bash npm run preview ```
This project is a static site. Deploy the `dist/` folder to any static hosting service (GitHub Pages, Vercel, Netlify, etc.).
For GitHub Pages, ensure your base path is correctly configured in `vite.config.js`.