Code to Image Online

Turn source code into a beautiful image like carbon.now.sh: syntax highlighting for 29 languages, 9 themes, window, line numbers, highlighted lines.

Result

Press “Run” to see the result.

Send code and get a picture of it in a macOS-style window, ready for a blog post, a slide, a tweet or a Zalo / Slack message. Highlighting uses highlight.js (BSD-3) with 29 grammars registered one by one (JavaScript, TypeScript, Python, Java, C, C++, C#, Go, Rust, PHP, Ruby, Swift, Kotlin, Dart, SQL, Bash, Shell, PowerShell, JSON, YAML, HTML / XML, CSS, SCSS, Markdown, Dockerfile, diff, INI / TOML, Lua, plain text) and language=auto detection. Themes: dracula (default), monokai, one-dark, github-dark, github-light, nord, night-owl, vscode-dark, solarized-light.

Options: title in the window bar, window=false for a plain card, line_numbers=true with first_line, highlight_lines=3,5-7, font_size, line_height, tab_size, outer padding with a background colour or a diagonal gradient (background2), shadow, and max_columns (longer lines are cut). Text is drawn from JetBrains Mono outlines (SIL OFL), which include Vietnamese, so comments such as // Tính tổng render correctly; characters outside the embedded fonts (emoji, CJK) are left blank with a warning.

Output: png (default, scale 2 for retina), svg (vector, glyphs as paths: identical everywhere) or json (SVG + PNG base64). No headless browser is used; up to 400 lines.

Use this in your code

curl -X POST "https://apibox.io.vn/v1/code-image" \
  -H "Authorization: Bearer YOUR_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{"code":"const sum = (a, b) => a + b;\nconsole.log(sum(2, 3)); // 5","language":"javascript","format":"json"}'

const res = await fetch('https://apibox.io.vn/v1/code-image', {
  method: 'POST',
  headers: {
    Authorization: 'Bearer YOUR_API_KEY',
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({
    "code": "const sum = (a, b) => a + b;\nconsole.log(sum(2, 3)); // 5",
    "language": "javascript",
    "format": "json"
  }),
});
const data = await res.json();
console.log(data);

import requests

res = requests.post(
    "https://apibox.io.vn/v1/code-image",
    headers={"Authorization": "Bearer YOUR_API_KEY"},
    json={"code": "const sum = (a, b) => a + b;\nconsole.log(sum(2, 3)); // 5", "language": "javascript", "format": "json"},
    timeout=30,
)
print(res.json())

<?php
$ch = curl_init('https://apibox.io.vn/v1/code-image');
curl_setopt_array($ch, [
    CURLOPT_RETURNTRANSFER => true,
    CURLOPT_CUSTOMREQUEST => 'POST',
    CURLOPT_HTTPHEADER => ['Authorization: Bearer YOUR_API_KEY', 'Content-Type: application/json'],
    CURLOPT_POSTFIELDS => '{"code":"const sum = (a, b) => a + b;\\nconsole.log(sum(2, 3)); // 5","language":"javascript","format":"json"}',
]);
$response = curl_exec($ch);
print_r(json_decode($response, true));

API documentation → Get a free API key

FAQ

Can I use my own font or theme?

Not yet: the image always uses JetBrains Mono and one of the 9 built-in themes, so the output looks the same everywhere. You can change the outer background and the window title.

How is the language detected?

With language=auto, highlight.js scores the code against the registered grammars and keeps the best one; the result reports it. Set language explicitly for short snippets.

Why is an emoji missing?

Only Latin (including Vietnamese), Greek, common symbols, box drawing and math characters are in the embedded fonts. Missing characters are left blank and a warning is returned with format=json.