代码截图生成器将代码片段渲染为带有窗口装饰的 PNG 图片，输入代码文本，选择语言和主题，点击下载即得到一张可直接发布的图片。它常用于技术博客配图、社交媒体分享和演示文稿，替代手动截屏并裁剪的繁琐流程。
语言高亮与主题搭配
工具通过 Shiki 实现语法高亮，支持 Shiki 所有内置语言（TypeScript、Python、Go、Rust、SQL、YAML 等数十种）。语言选择准确时，关键字、字符串、注释的颜色区分更清晰，截图可读性更好。
主题决定代码窗口的背景和配色风格。默认主题为 Vercel 风格（深色）。每个主题同时提供浅色和深色两种外观变体，深色版本适合深色封面和暗底界面，浅色版本适合白底文档和亮色设计稿。
背景内边距与透明背景
背景内边距控制代码窗口外围的渐变画布宽度，范围 0–200 px（工具界面滑块上限 100 px）。移动端默认 32 px，桌面端默认 64 px。
- 用于技术文档或 GitHub README：建议 16–32 px，紧凑简洁
- 用于社交媒体封面图：建议 48–80 px，呼吸感更强
开启透明背景后，导出的 PNG 不包含渐变外框，只保留代码窗口本体，适合嵌入 Figma 设计稿或叠加在自定义背景上。
导出分辨率与宽度
图片宽度根据代码最长行长度自动估算（字符数 × 字号 × 0.62 + 160），并受最大宽度参数约束（最小 280 px，最大 1600 px，默认 960 px）。设备像素比最高取 2×，视网膜屏幕下导出图片实际像素为显示宽度的两倍，适合高分辨率发布。
适合截图的代码
- 行数控制在 10–40 行
- 每行不超过 80 个字符
- 聚焦单个函数或关键片段
- 删除无关注释和空行
影响图片质量的因素
- 语言选错会导致高亮失效
- 代码超宽时文字会折行
- 透明背景在不支持的平台失效
- 内边距为 0 时无渐变装饰
所有处理在浏览器本地完成
代码不会上传到服务器，渲染和导出完全在浏览器内完成。涉及敏感逻辑（密钥、业务算法）的代码片段可以放心使用，但建议截图前将真实密钥替换为占位符，避免在发布后泄露。