MD to Share / MD 转长图

A skill that converts Markdown files to long images, directly callable by AI Agents like OpenClaw and Claude Code. Perfect for sharing on WeChat, Discord, and other platforms.

将 Markdown 文件转换为原生长图的 skill，可使用 OpenClaw、Claude Code 等 AI Agent 直接调用。方便分享到微信、Discord 等平台。

Features / 特点

• Environment Auto-Detection: Automatically detects OpenClaw vs Claude Code and applies optimal settings

• High Resolution: Configurable width up to 1600px (2x scale factor) for crisp display

• Auto Theme: Light mode (6:00-18:00) / Dark mode (18:00-6:00) based on time

• Discord Optimized: JPEG format at 85% quality, auto-splits large files

• Cross-Platform: Auto-detects Chrome on macOS, Linux, and Windows

• Smart Splitting: Splits at semantic boundaries (headings, hr) not mid-paragraph

• Robust Error Handling: Clear exit codes for AI agents to understand failures

• 环境自动检测：自动检测 OpenClaw 或 Claude Code 环境，应用最优设置

• 高分辨率：可配置宽度最高 1600px（2x 缩放因子），在所有平台上清晰显示

• 自动主题：根据时间自动切换浅色（6:00-18:00）/ 深色（18:00-6:00）模式

• Discord 优化：JPEG 格式 85% 质量，自动切分大文件

• 跨平台：自动检测 macOS、Linux、Windows 上的 Chrome

• 智能切分：在语义边界（标题、分隔线）处切分，不会在段落中间

• 健壮错误处理：清晰的退出码，方便 AI Agent 理解错误

Quick Start / 快速使用

Use this skill when user asks to "forward", "convert to image", "share", "generate long image".

当用户要求"转发"、"转成图片"、"方便分享"、"生成长图"时使用此 skill。

Usage / 使用方法

1. Convert Command / 转换命令

md2img <input.md> [output] [options]

Options / 选项:

Output formats / 输出格式:

• .jpg / .jpeg - JPEG format (default, recommended for Discord)
• .png - PNG format (lossless, larger files)

Example / 示例：

# Basic usage (auto-detects environment, outputs to document-长图.jpg)
md2img "~/Downloads/document.md"

# Specify output path with format
md2img "~/Downloads/document.md" "~/Downloads/output.jpg"
md2img "~/Downloads/document.md" "~/Downloads/output.png"

# Force OpenClaw preset for 1200px output
md2img "~/Downloads/document.md" --preset=openclaw

# Force generic preset for 1600px output
md2img "~/Downloads/document.md" --preset=generic

# Custom parameters
md2img "~/Downloads/document.md" --width=600 --scale=2 --max-size=5

# Force dark theme
md2img "~/Downloads/document.md" --theme=dark

2. Configuration Presets / 配置预设

Auto-Detection Logic / 自动检测逻辑:

• If OPENCLAW_CHANNEL or OPENCLAW_SKILLS_DIR env var exists → openclaw preset
• If current directory contains .openclaw/skills → openclaw preset
• Otherwise → generic preset

3. Send to Discord / 发送到 Discord

Use the message tool's media parameter:

{
  "action": "send",
  "target": "channel_id",
  "message": "Brief description",
  "media": "/full/path/to/image.jpg"
}

Note: If the converted image exceeds the size limit, it will be automatically split into multiple files:

• output-1.jpg, output-2.jpg, output-3.jpg, ...

注意：如果转换后的图片超过大小限制，会自动切分为多个文件。

4. Send to WeChat / 发送到微信

• Image is generated at the specified path
• Open file manager to get the image
• Or copy to clipboard and paste

Image Quality Optimization / 图片清晰度优化

OpenClaw + Discord Flow / OpenClaw + Discord 流程

OpenClaw has two layers of image compression:

1. Agent layer: imageMaxDimensionPx=1200, maxBytes=5MB
2. Media loading layer: MAX_IMAGE_BYTES=6MB, scales down from 2048px

OpenClaw 有两层图片压缩：

1. Agent 层：imageMaxDimensionPx=1200，maxBytes=5MB
2. 媒体加载层：MAX_IMAGE_BYTES=6MB，从 2048px 逐步缩小

Recommended / 推荐: Use --preset=openclaw to output 1200px images under 5MB. This bypasses both compression layers.

推荐：使用 --preset=openclaw 输出 1200px 且小于 5MB 的图片，这样可以绕过两层压缩。

With openclaw preset / 使用 openclaw 预设:
Skill outputs 1200px (< 5MB)
    ↓
Agent layer: 1200px ≤ 1200px → No compression ✓
    ↓
Media layer: 5MB < 6MB → No compression ✓
    ↓
User receives: 1200px (guaranteed) / 用户收到：1200px（确定）

Final Resolution Reference / 最终分辨率参考

Exit Codes / 退出码

When the skill fails, check the exit code to understand the error:

当 skill 失败时，检查退出码以理解错误：

Configuration / 配置

Environment Variables / 环境变量

Default Settings by Preset / 各预设默认设置

OpenClaw preset:

• Width: 600px CSS (1200px actual with 2x scale)
• Max file size: 5MB (auto-splits if larger)

Generic preset:

• Width: 800px CSS (1600px actual with 2x scale)
• Max file size: 8MB (auto-splits if larger)

Common:

• Format: JPEG at 85% quality
• Timeout: 30 seconds
• Theme: Light mode 6:00-18:00, Dark mode 18:00-6:00

Dependencies / 依赖

• Node.js 18+
• puppeteer-core
• marked
• Google Chrome or Chromium (uses system-installed browser)

Dependencies are installed at ~/.openclaw/skills/md-to-share/node_modules/

Styling / 样式说明

Generated image styles:

• H1: Large font with red bottom border
• H2: Blue left border accent
• H3: Gray color, smaller than H2
• Tables: Zebra stripes with hover highlight
• Code blocks: Dark background
• Inline code: Light gray background with red text
• Blockquotes: Blue border + light gray background
• Horizontal rules: Elegant dividers

Example / 示例

When user says "share this to WeChat" or "make it easy to forward":

1. Read the MD file content
2. Run md2img to convert to long image
3. Tell user the image path, or send directly to the specified platform

Troubleshooting / 故障排除

Chrome not found / Chrome 未找到

Set the CHROME_PATH environment variable:

# macOS/Linux
export CHROME_PATH="/Applications/Chromium.app/Contents/MacOS/Chromium"

# Windows
set CHROME_PATH=C:\Program Files\Chromium\Application\chrome.exe

Image too large / 图片太大

The tool automatically splits images at semantic boundaries (headings, horizontal rules). If you still have issues:

• Use JPEG format (default) instead of PNG
• Use --max-size to set a smaller split threshold
• Consider splitting your markdown into smaller files

Image quality too low in OpenClaw / OpenClaw 图片清晰度低

Make sure you're using the openclaw preset (should auto-detect):

md2img input.md --preset=openclaw

This ensures 1200px output that bypasses OpenClaw's compression layers.