Back to Details

markdown-to-image

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

Markdown 转精美图片

Markdown to Exquisite Image

将 Markdown 内容渲染为精美的分享海报图片，适合微信、小红书、微博等平台。
Render Markdown content into beautiful shareable poster images, suitable for platforms like WeChat, Xiaohongshu, and Weibo.

核心特性

Core Features

  • 固定 3:4 比例（1080×1440 像素）
  • 自动分页 - 内容较多时生成多张图片
  • 智能 SVG 头图 - 根据主题关键词自动生成相应风格的手绘线条图
  • 智能标题 - 自动提取嘉宾名和主题，格式为「嘉宾：主题」
  • 白色背景 + 大字体 - 清晰易读，专业排版
  • 自适应布局 - 内容均匀分布，减少留白
  • 宽字间距行间距 - 参考优秀海报排版
  • Fixed 3:4 aspect ratio (1080×1440 pixels)
  • Auto-pagination - Generate multiple images when content is extensive
  • Smart SVG Header Image - Automatically generate hand-drawn line art in corresponding styles based on topic keywords
  • Smart Title - Automatically extract guest names and topics in the format "Guest: Topic"
  • White background + large font - Clear and readable, professional layout
  • Adaptive layout - Evenly distribute content to reduce blank space
  • Wide character and line spacing - Referencing excellent poster layouts

快速开始

Quick Start

基本用法

Basic Usage

bash
undefined
bash
undefined

转换 Markdown 文件为图片（自动分页）

Convert Markdown file to images (auto-paginated)

python3 scripts/md_to_image.py --file /path/to/content.md
python3 scripts/md_to_image.py --file /path/to/content.md

指定输出目录

Specify output directory

python3 scripts/md_to_image.py --file /path/to/content.md --output-dir /path/to/output
python3 scripts/md_to_image.py --file /path/to/content.md --output-dir /path/to/output

调整每页条目数

Adjust number of items per page

python3 scripts/md_to_image.py --file /path/to/content.md --items-per-page 4
undefined
python3 scripts/md_to_image.py --file /path/to/content.md --items-per-page 4
undefined

参数说明

Parameter Description

参数说明默认值
--file
, 
-f
Markdown 文件路径必填
--output-dir
, 
-o
输出目录
attachments/MMDD
--width
, 
-w
图片宽度（像素）
1080
--items-per-page
每页显示条目数
5
ParameterDescriptionDefault Value
--file
, 
-f
Path to Markdown fileRequired
--output-dir
, 
-o
Output directory
attachments/MMDD
--width
, 
-w
Image width (pixels)
1080
--items-per-page
Number of items displayed per page
5

输出规格

Output Specifications

  • 比例: 固定 3:4（1080×1440 像素）
  • 格式: PNG
  • 分页: 自动根据内容生成多张图片
  • 命名: 
    page_1.png
    , 
    page_2.png
    , ...
  • 保存位置: 默认 
    attachments/MMDD
    （MMDD 为当日日期）
  • Aspect Ratio: Fixed 3:4 (1080×1440 pixels)
  • Format: PNG
  • Pagination: Automatically generate multiple images based on content
  • Naming: 
    page_1.png
    , 
    page_2.png
    , ...
  • Save Location: Default 
    attachments/MMDD
    (MMDD is the current date)

智能 SVG 头图

Smart SVG Header Image

根据文章主题自动生成不同风格的 SVG 装饰图：
主题关键词生成的 SVG 风格
AI
、
AGI
、
通用
神经网络节点 → 大脑 → 对话泡泡
开源
、
open source
开源符号 → 代码括号 → 分享图标
其他（默认）麦克风 → 声波 → 人物对话
SVG 特点：
  • 手绘风格，黑色线条白底
  • 宽幅 16:9 比例
  • 140px 高度，居中显示
  • 底部带主题文字标签
Automatically generate different styles of SVG decorative images based on article topics:
Topic KeywordsGenerated SVG Style
AI
, 
AGI
, 
通用
(General)		Neural network nodes → Brain → Dialogue bubbles
开源
(Open Source), 
open source
Open source symbols → Code brackets → Share icons
Others (Default)Microphone → Sound waves → Character dialogue
SVG Features:
  • Hand-drawn style, black lines on white background
  • Wide 16:9 aspect ratio
  • 140px height, centered display
  • With topic text label at the bottom

智能标题提取

Smart Title Extraction

自动从 Markdown 元信息中提取嘉宾和主题：
输入格式：
markdown
undefined
Automatically extract guests and topics from Markdown meta-information:
Input Format:
markdown
undefined

播客名称

Podcast Name

嘉宾: Sebastian Raschka（LLM研究员） 主题: 2025年AI技术趋势

**输出标题**：`Sebastian Raschka：2025年AI技术趋势`
Guest: Sebastian Raschka (LLM Researcher) Topic: AI Technology Trends in 2025

**Output Title**: `Sebastian Raschka: AI Technology Trends in 2025`

Markdown 格式处理

Markdown Format Processing

格式渲染效果
# 标题
自动提取并组合为「嘉宾：主题」
> **嘉宾**: ...
提取嘉宾名（移除 
**
）
> **主题**: ...
提取主题内容
**加粗**
红色加粗文字（移除 
**
标记）
1、2、3、
红色圆形数字编号
"引用内容"
蓝色高亮引用
FormatRendering Effect
# Heading
Automatically extracted and combined into "Guest: Topic" format
> **Guest**: ...
Extract guest name (remove 
**
markers)
> **Topic**: ...
Extract topic content
**Bold Text**
Red bold text (remove 
**
markers)
1、2、3、
Red circular numbering
"Quoted Content"
Blue highlighted quote

工作流程

Workflow

当用户请求将 Markdown 转为图片时：
  1. 确定输入内容
    • 如果用户指定了文件路径，使用该文件
    • 如果用户当前打开了 Markdown 文件，默认使用该文件
  2. 自动处理
    • 提取嘉宾和主题生成标题
    • 根据主题关键词生成相应 SVG 头图
    • 提取短版摘要（
      📱 短版摘要
      部分）
    • 移除所有 
      **
      markdown 标记，转为真正的加粗样式
    • 根据条目数量自动分页
  3. 输出结果
    • 返回所有图片路径给用户
    • 图片保存在 
      attachments/MMDD
      目录
When a user requests to convert Markdown to images:
  1. Determine Input Content
    • If the user specifies a file path, use that file
    • If the user has a Markdown file open, use that file by default
  2. Automatic Processing
    • Extract guest and topic to generate title
    • Generate corresponding SVG header image based on topic keywords
    • Extract short summary (section marked 
      📱 Short Summary
      )
    • Remove all 
      **
      markdown markers and convert to actual bold style
    • Automatically paginate based on number of items
  3. Output Results
    • Return all image paths to the user
    • Images are saved in the 
      attachments/MMDD
      directory

常见用法

Common Usage

用户说操作
「把这个转成图片」转换当前打开的 Markdown 文件
「生成分享海报」同上
「这个播客摘要转图片」转换播客摘要文件
「Markdown 转图片」同上
User InputAction
「把这个转成图片」Convert the currently open Markdown file
「生成分享海报」Same as above
「这个播客摘要转图片」Convert the podcast summary file
「Markdown 转图片」Same as above

依赖

Dependencies

脚本依赖以下 Python 包：
  • playwright
    - 浏览器自动化渲染
  • markdown
    - Markdown 解析
  • requests
    - 网络请求（备用）
首次使用需安装：
bash
pip3 install playwright markdown requests
playwright install chromium
The script depends on the following Python packages:
  • playwright
    - Browser automation rendering
  • markdown
    - Markdown parsing
  • requests
    - Network requests (backup)
Install for first use:
bash
pip3 install playwright markdown requests
playwright install chromium

更新日志

Changelog

v1.1 (2026-02-01)

v1.1 (2026-02-01)

  • ✅ 智能 SVG 头图：根据主题关键词自动生成相应风格
  • ✅ 智能标题：自动提取「嘉宾：主题」格式
  • ✅ 移除 
    **
    标记：元信息和正文中的 markdown 加粗正确转换
  • ✅ SVG 更大更醒目：140px 高度，600px 宽
  • ✅ 优化排版：更大字体、更宽间距、自适应布局
  • ✅ Smart SVG Header Image: Automatically generate corresponding styles based on topic keywords
  • ✅ Smart Title: Automatically extract in "Guest: Topic" format
  • ✅ Remove 
    **
    markers: Correctly convert markdown bold in meta-information and body content
  • ✅ Larger and more prominent SVG: 140px height, 600px width
  • ✅ Optimized layout: Larger font, wider spacing, adaptive layout

v1.0 (2026-02-01)

v1.0 (2026-02-01)

  • 初始版本
  • 固定 3:4 比例
  • 自动分页
  • 白色背景设计
  • Initial version
  • Fixed 3:4 aspect ratio
  • Auto-pagination
  • White background design