5 free generations remaining today
Automate with the API
Generate markdown images programmatically. Render changelogs, README previews, and release notes as images in your CI/CD pipeline.
import { marked } from 'marked';
import fs from 'fs';
// 1. Read markdown and convert to HTML
const markdown = fs.readFileSync('README.md', 'utf-8');
const htmlContent = marked.parse(markdown);
// 2. Wrap in styled template
const html = `<html><head>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/github-markdown-css@5/github-markdown-light.css">
<style>body{ padding:48px; background:#fff } .markdown-body{ max-width:800px; margin:auto }</style>
</head><body><div class="markdown-body">$${htmlContent}</div></body></html>`;
// 3. Call Pictify API
const response = await fetch('https://api.pictify.io/image', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Authorization': `Bearer $${YOUR_API_KEY}`
},
body: JSON.stringify({
html, width: 1200, height: 630, fileExtension: 'png'
})
});
const { image } = await response.json();
console.log(image.url); // https://cdn.pictify.io/img/abc123.pngTHIS TOOL IS THIS CALL
Automate with the API
Trigger this workflow programmatically. Personalized images, generated instantly at scale.
Get your API keycurl -X POST https://api.pictify.io/image \
-H "Content-Type: application/json" \
-H "Authorization: Bearer YOUR_API_KEY" \
-d '{
"html": "<your-template-html>",
"width": 1200,
"height": 630,
"fileExtension": "png"
}'Why teams choose this workflow
Markdown is the lingua franca for documentation, but sharing snippets on X, LinkedIn, or internal blogs normally involves clunky screenshots. By rendering Markdown as HTML and converting it to an image, teams keep typography clean and brand-aligned.
Engineering, product, and developer relations teams turn README highlights, release notes, and code snippets into snackable graphics using this workflow.
The Context
that require or prefer images: Twitter, LinkedIn, Instagram, and internal wikis. Traditional screenshots
capture browser chrome and create inconsistent visuals. With Pictify's Markdown to image converter,
you render your Markdown as beautifully styled HTML and convert it directly to a crisp, shareable image.
Perfect for changelogs, README highlights, code tutorials, and release announcements.
Use dark mode themes, syntax highlighting, and custom fonts to match your brand. The API integration lets
you automate image generation from Markdown files in your CI/CD pipeline; every time you push a release,
a social card is generated automatically. No more manual screenshots or inconsistent formatting across
your marketing channels.
Who uses this?
- Developer advocates sharing code snippets on Twitter/X
- Open source maintainers creating README preview images
- DevRel teams generating release notes social cards
- Technical writers creating documentation thumbnails
- Engineering teams sharing changelog updates internally
Problems Solved
- Difficult to share Markdown on visual-first channels
- Screenshots pick up UI chrome and reduce readability
- Formatting inconsistencies when copying into slides
Step-by-step workflow
Convert Markdown to HTML
Use your static site generator or a Markdown parser to create HTML with the desired theme.
Pick social-friendly dimensions
Square (1080×1080) for Instagram, 1200×630 for LinkedIn/Twitter cards.
Customize and export
Adjust background, fonts, and callouts before generating the final asset.
Frequently Asked Questions
Can I use dark mode themes?
Does syntax highlighting survive?
Can I automate this in my CI pipeline?
50 renders a month. No card.
A free account lifts the daily limit, keeps your renders, and turns this page into an API call you can put in a cron.
- NO WATERMARK
- API KEY IN 10 SECONDS
- SAVE AS A REUSABLE TEMPLATE
COMES BACK TO THIS PAGE AFTER SIGNUP