System Updates

• Multi-format Recognition: Accurately identifies Mermaid diagrams, raw HTML/XML, source code (Python, JS, CSS, etc.), and LaTeX math formulas.
• Structural Analysis: Uses intelligent regex and structural thresholds (e.g., brace density, semicolon count) rather than simple keyword matching.
• Performance Optimized: Built with debounce logic to ensure real-time typing performance remains buttery smooth without blocking the main thread.

• One-Click Switch: A sticky banner automatically appears when a mismatch is detected, offering a one-click redirect to the most appropriate tool.
• State Preservation: Your drafted content is safely cached in sessionStorage during the redirect. Once the target tool loads, it instantly snaps your content right into the editor. No more copy-pasting back and forth!

• Inline SVG Rendering: Paste <svg>...</svg> code directly into your Markdown, and it automatically renders as a visual graphic — fully preserving gradients, filters, clip paths, and CSS animations.
• Code Display Mode: Use ```svg code blocks to display SVG source code with syntax highlighting, perfect for tutorials and documentation.
• Perfect Fidelity: Bypasses the HTML5 parser's handling of XML namespaces (xmlns:xlink, xlink:href) and SVG-specific attributes (clip-path, filter), ensuring the rendered output matches the original SVG exactly.

• Perfect Rendering: Supports modern CSS, flexbox, grid, and typography, accurately converted to image formats.
• Export Options: Download your HTML snippets as PNG, JPEG, WebP, or PDF.
• File Upload & URL Import: Easily import existing .html files or fetch HTML directly from any public URL.
• API Support: Fully integrated with our /api/v1/images/generate endpoint for programmatic generation.

• Use ```plantuml code blocks to render UML diagrams (sequence, class, use case, activity diagrams, etc.).
• Powered by the PlantUML public server, producing high-quality SVG output with no local Java installation required.

• Use ```infographic code blocks to render infographic visualizations.
• Integrates the AntV Infographic engine with ~200 built-in infographic templates.
• Supports list, flow, comparison, and many other layout types.

• Two syntax options: [text]{annotation} and [text]^(annotation).
• Mono ruby: when character count matches syllable count, each character is individually annotated.
• Smart matching: truncates extra syllables when they exceed characters; wraps as a group when characters exceed syllables.
• Supports spaces, ·, and ・ as syllable delimiters.

• Added support for \(...\) inline math and \[...\] display math syntax.
• Automatically converted to remark-math compatible format, working alongside existing $...$ / $$...$$ syntax.

• Published on npm: Install instantly with npx markdowntoimage-mcp — zero configuration, just add your API token.
• Two Tools Available:
  • generate_image — Convert Markdown to PNG/JPEG/WebP with full parameter support (themes, code styles, fonts, width, quality).
  • get_usage — Check your monthly API quota and credit balance.
• Rich Parameter Descriptions: The tool schema includes all available theme, code style, and font options, helping AI models select the best settings automatically.
• Stdio Transport: Works out of the box with Claude Desktop, Cursor, and other MCP clients via standard I/O.

Add this to your claude_desktop_config.json:

{
  "mcpServers": {
    "markdowntoimage": {
      "command": "npx",
      "args": ["-y", "markdowntoimage-mcp"],
      "env": {
        "MTI_API_TOKEN": "mti_your_token_here"
      }
    }
  }
}

Then just ask Claude: "Convert this markdown to an image" — it handles the rest.

• npm: npm install markdowntoimage-mcp
• Get API Token: Profile → API Tokens
• API Docs: markdowntoimage.com/api-docs

• Image Generation API: POST /api/v1/images/generate — Convert Markdown to PNG, JPEG, or WebP images with full support for code highlighting, KaTeX math, Mermaid diagrams, and 19 visual themes.
• Usage Statistics API: GET /api/v1/account/usage — Track your monthly quota and credit balance in real time.
• MCP-Compatible Schema: GET /api/v1/schema — API schema in MCP (Model Context Protocol) tool definition format, ready for AI agent integration.
• Two Response Modes: Choose between url mode (temporary image URL, retained for 24 hours) or binary mode (raw image data).

• Secure Token Management: Create, list, and revoke API tokens from your profile page. Tokens are stored as SHA-256 hashes — your secret is shown only once upon creation.
• Bearer Token Auth: Simple Authorization: Bearer mti_xxx header for all API calls.

• 50 Free Requests/Month: Every account gets 50 free API calls per month (images include a watermark).
• Credit-Based Requests: After the free quota, each request costs 1 credit and the watermark is automatically removed.
• Usage Dashboard: Monitor your free quota and credit balance on the API Tokens page.

• Interactive API Docs: A new /api-docs page with endpoint documentation, parameter references (including all valid values for themes, code styles, and fonts), and code examples in cURL, Python, Node.js, and Go.
• API Announcement Banner: A site-wide banner notifying users about the new API availability.

• Theme Rendering Fix: Fixed an issue where the theme parameter had no effect on API-generated images. All 19 themes now apply correctly.
• Font Rendering Fix: Fixed an issue where fontFamily parameter (e.g., inter, japanese) was loaded but not applied. Google Fonts now correctly set the CSS font-family property.

• Homepage Title Optimization: Refined the homepage title typography to ensure perfect visibility of all characters while maintaining a sleek, tight aesthetic.
• AdSense Layout Fixes: Resolved layout issues on ultra-wide screens (>2560px) where the navigation header could obscure sidebar content.
• Duplicate H1 Removal: Optimized page structure for better SEO by ensuring a single, semantic H1 tag on converter and markdown-to-cards pages.

• Modular Translation System: Refactored the entire localization system, splitting large JSON files into modular components for better maintainability and faster loading.
• Complete Language Support: Added comprehensive translation files for the explore feature across all supported languages (Chinese, English, Spanish, German, Portuguese, Japanese).
• Missing Message Fixes: Fixed various MISSING_MESSAGE errors in Spanish, Chinese, and other locales to ensure a seamless localized experience.

• Sample Content Updates: Updated sample markdown templates to follow best practices for heading hierarchy.
• Performance: Optimized load times by reducing translation bundle sizes.

• User Media Library: Added a user media library to automatically save uploaded file records for easy management and reuse.
• Formula Centering: Added a setting to toggle formula centering, offering more flexibility in math formula layout.
• Watermark Optimization: Added "created by markdowntoimage.com" watermark to images generated in Code, Mermaid, and Formula modes.
• Code Formatting: Optimized the formatting of code blocks.

• Font Loading Optimization:
  • Resolved font loading issues and adjusted dynamic font loading strategy.
  • Fixed font loading for Markdown to Cards.
  • Fixed inconsistency between preview font selection and frontend selection.
  • Fixed document undefined error during page initialization.
• Multilingual Fixes: Fixed missing translation keys in multilingual environments.

We've launched the brand new Markdown to Cards feature! Now you can easily convert Markdown text into beautiful social media sharing cards.

• Multiple Layouts: Offers various preset card styles to meet different needs.
• Smart Typography: Automatically optimizes the display of long text on cards.
• Social Sharing: Generated image sizes are perfectly adapted for platforms like Twitter, Instagram, and Xiaohongshu.

To make the generated images better match your brand or personal style, we've significantly enhanced theme customization capabilities:

• Color Customization: You can now freely modify the colors of headings, body text, links, and emphasized text, no longer limited to preset themes.
• Font Selection: Added a variety of selected fonts to support richer Chinese and English mixed layout effects.
• Background Images: Supports uploading custom background images, with Overlay and Blur options to make text clearer.

• Japanese Support Added: We've officially added Japanese support! 🇯🇵
• Translation Optimization: Comprehensively checked and fixed missing translations (i18n) to improve the user experience in multi-language environments.

• Logo Display: Fixed the issue where the Logo position was offset in some themes.
• Performance Optimization: Optimized the performance and stability of Batch Images generation.
• Preview Optimization: Fixed issues where preview caching could cause old content to remain.
• Experience Details: Added a "Powered by" link display to help users learn more.

Come and experience these new features! If you have any suggestions or encounter any issues, please feel free to provide feedback.