Code Screenshot Generator

生成带语法高亮的代码截图,并导出为 SVG、PNG、JPEG、WebP 或 HTML。

代码
粘贴要转换成图片的代码片段。
语法
选择高亮、语言检测和配色主题。
渲染
背景
设置代码卡片后的画布。
背景模式
窗口
选择窗口控件样式和行号显示方式。
窗口样式
布局
调整间距、字号、圆角和制表符宽度。

Code Screenshot Generator

What it does

Code Screenshot Generator 会把粘贴的代码片段转换成精致的代码卡片,可导出为 SVG、PNG、JPEG、WebP 或独立 HTML。它在你的浏览器中运行,使用可选主题应用语法高亮,并允许你在下载前调整窗口框架。

When to use it

当文档图片、发布说明、博客文章、演示文稿、社交预览和错误报告中,带样式的代码片段比纯文本更易浏览时,可以使用它。SVG 和 HTML 导出适合文档,能保持清晰;PNG、JPEG 和 WebP 则适用于需要位图图片的工具。

How to get a clean export

选择最接近的语言,或让语言检测保持自动,然后选择一个在目标场景中对比度足够的主题。当代码片段会在讨论中被引用时保留行号;如果需要用于其他设计的透明素材,请关闭外部背景。

Privacy and limitations

代码片段会在页面本地处理,不会由此工具上传。非常大的文件可能会让高亮和位图导出变慢,因此请在导出前将代码片段裁剪到你想展示的行。