Ray.so：惊艳的代码截图

📝

Ray.so 是 Raycast 推出的一款免费在线工具，用于将代码片段转换为美观、可自定义的图片，方便在社交

原文链接：https://mp.weixin.qq.com/s/gybq4W3UZms2r4zN7ChihQ

Ray.so 是 Raycast 推出的一款免费在线工具，用于将代码片段转换为美观、可自定义的图片，方便在社交

Ray.so 是 Raycast 推出的一款免费在线工具，用于将代码片段转换为美观、可自定义的图片，方便在社交媒体、博客、演示文稿等场景中分享代码。

• 原始代码截图丑陋
  ：直接截图 IDE 或终端代码，背景杂乱、字体不统一、缺乏视觉美感
• 分享代码不够”体面”
  ：开发者在推特/朋友圈/技术博客分享代码片段时，希望像分享设计作品一样有质感
• 重复劳动
  ：手动用设计软件（PS、Figma）给代码加背景、调整排版，耗时且门槛高
• 格式不统一
  ：团队内部分享代码截图风格各异，缺乏一致的视觉语言

背景

• 出品方 Raycast 是一款效率工具（macOS 启动器/生产力工具），在开发者社区有很强的口碑和品牌认知
• 这类”代码转图片”工具早期由 Carbon（carbon.now.sh）开创并普及，Ray.so 是该品类的后继竞品，借助 Raycast 的品牌流量迅速获得关注
• 顺应了”开发者美学”这一潮流——程序员越来越注重工具和内容呈现的设计感

概念

说明

代码片段（Snippet）

用户粘贴/输入的源代码文本

主题（Theme）

控制配色、背景样式

渲染参数

暗色模式、行号显示、内边距（padding）、语言语法高亮

导出（Export）

将渲染结果输出为图片文件

使用方法与步骤

• 打开 ray.so 网站
• 在编辑区粘贴或输入代码
• 选择编程语言（如 TypeScript）以启用对应语法高亮
• 调整主题设置：
• 开启/关闭”Dark mode”
• 开启/关闭”Line numbers”（行号）
• 选择 Padding 大小（16 / 32 / 64 / 128）
• 选择背景样式
• 点击 “Export” 导出为图片
• 下载或复制生成的图片，用于分享

功能要点

• 多语言语法高亮
  （支持 TypeScript 等主流语言）
• 可调节的留白/内边距
  ，控制图片”呼吸感”
• 明暗模式切换
• 行号显示开关
• URL 参数化
  ：所有设置（背景、暗色模式、行号、padding、语言）都编码进 URL，可直接分享配置链接，无需注册账号
• 零门槛
  ：无需登录、无需安装，浏览器打开即用

真正解决的问题

将”代码”从纯功能性文本，转化为具备设计感、适合传播的视觉内容——本质是降低了”代码美化 + 图片化”这一细分需求的操作成本，让开发者用几秒钟做到过去需要设计工具才能实现的效果。

与同类产品的区别

产品

特点
Carbon
该品类鼻祖，功能更丰富（自定义字体、水印、更多主题），但界面相对陈旧、加载稍重
Ray.so
界面更简洁现代（延续 Raycast 一贯的极简设计语言），加载快，设置项精简但覆盖核心需求，品牌自带流量
Codeimg.io / Snappify 等
各有细分特色（如 Snappify 支持代码动画/演示），但知名度不及前两者

Ray.so 的差异化核心不在功能堆砌，而在极简交互 + 设计美学 + 免费无门槛。

---

💬 本文评论区已开启，但暂无读者留言。

本文转载自微信公众号，如有侵权请联系删除。