跳到主要内容

程序员必备 30 个浏览器工具

我每天都在用的 30 个浏览器小工具, 全部免登录、100% 本地, 按使用频次分组排序。

发布于 作者 李雷
#roundup #developer #tools

程序员必备 30 个浏览器工具

我的浏览器书签栏里有一栏叫 "tools", 装的就是这 30 个东西。多数是十秒钟用完就关掉的: 把一段 JSON 美化一下、查个 HTTP 状态码、把字符串 base64 一下。装本地 CLI 太重, 在 VS Code 里翻插件太慢, 这种活就该在标签页里完成。

下面这份清单按我自己的使用频次和场景分组。每个工具都开过, 不会出现"作者也没用过的工具混进来凑数"的情况。所有页面都是纯前端, 你粘进去的数据不会出这个标签页。

1. JSON / YAML / 配置文件 (5 款)

1. JSON 格式化器

我打开次数最多的一个标签页, 没有之一。接联调环境时, 后端塞过来的 JSON 经常是单行 12 KB, 这页打开能立刻美化、折叠、按路径检索。5 MB 以内都是秒开, 不会像某些在线 JSON 工具拖一下卡两秒。我把它钉在了任务栏的第一个固定标签里。

2. YAML 格式化器

写 K8s manifest 和 GitHub Actions workflow 时, 缩进错一格就报错。这个工具能高亮非法缩进, 顺便告诉你某个 key 重复了。比直接交给 kubectl apply 再看错误日志, 快两倍。

3. YAML 转 JSON

拿到一份 docker-compose.yml 想塞给一个只吃 JSON 的工具时, 直接粘进去出结果。反向需求也常见, 写 helm values 时我有时候先用 JSON 思考结构再转 YAML。

4. CSV 转 JSON

运营给我一份 CSV 让我导入数据库, 中间这一步永远是 CSV → JSON → SQL 批量 insert 语句。表头自动当 key, 空字段不会丢, 双引号转义也处理得对。

5. XML 转 JSON

对接老系统时 XML 还是绕不开的, SOAP 和 RSS 都在用。粘一段 XML 进去, 能看到树状结构再决定怎么解析。

2. 速查表 (8 款)

6. Git 速查表

git reset --hardgit reset --soft 的区别每隔三个月就要查一次。比开浏览器搜 stackoverflow 然后被广告糊一脸, 不如直接来这里。包含 rebase / cherry-pick / reflog 的几个常用救命姿势。

7. Vim 速查表

本地有 cheat.sh 是好, 但远程登 SSH 跳板机时, 用浏览器查一下 :%s/foo/bar/gc 的语法是最快的。命令按编辑/移动/搜索分类, 一屏看完。

8. Bash 速查表

写 shell 脚本时, ${var%.*}${var%%.*} 到底哪个去掉的多, 我每次都得验证。这页把变量展开、参数替换、循环结构、test 表达式分块罗列, 翻三秒就能确认。

9. Docker 速查表

docker execdocker run 的参数顺序经常打错, 容器进不去时排错也常翻 --mount-v 的语义差别。这页把日常 80% 命令分了 build / run / 网络 / volume 四块。

10. Kubectl 速查表

debug 一个 pod 时常要的几个魔法咒语: kubectl get pod -o widekubectl describekubectl logs --tail=100 -f、port-forward 的参数顺序。打印出来贴显示器边上的那种内容, 这页直接装下了。

11. SQL 速查表

不写 SQL 的项目期, JOIN 类型一过半年就糊了。INNER / LEFT / FULL OUTER 的图示放在一起, 加上 window function 那几个最常用的 ROW_NUMBER / RANK / LAG, 写复杂查询前先翻一下省得返工。

12. Regex 速查表

正则表达式那几个零宽断言 (?=) (?<=) (?!) (?<!) 我能记住语义记不住符号。这页按断言、量词、字符类、捕获组分块, 写复杂正则前两秒钟回血。

13. Tailwind 速查表

写 Tailwind 时, space-xgap 的区别、grid-cols-[200px_1fr] 这种任意值写法, 不查表写不出来。这页按布局、间距、文字、颜色、响应式分组, 找一个 class 不会被淹没在官方文档的瀑布里。

3. 加密 / 哈希 / 编码 (4 款)

14. Base64 编解码

HTTP basic auth 写测试用例时, 把 user:pass base64 一下塞 Authorization header。在 nginx 配 auth_basic_user_file 时也会用到。比开终端 echo -n "user:pass" | base64 还快一点, 因为不用怕忘记 -n

15. JWT 解码器

生产环境 401 时, 把请求头里那串 token 粘进来看 payload 里的 exp 是不是过期了, 看 iss 是不是发错了。完全本地解析, 这点很重要, 生产 token 这种东西不能往不知名的在线工具上送。

16. JWT 编码器

写测试时手搓一个 JWT, 选算法、填 payload、给 secret, 一秒出。常用来跑 e2e 测试时模拟不同角色的用户。

17. MD5 / SHA 哈希计算器

对比文件完整性、生成签名比对、把字符串哈希后当 key 用。MD5/SHA-1/SHA-256/SHA-512 一起出, 不用切工具。

4. DevOps / 运维 (5 款)

18. Cron 表达式解释器

0 */6 * * 1-5 时, 我每次都要确认它真的是工作日每 6 小时执行而不是周末。这页粘进去后给出"未来 5 次执行时间", 比心算靠谱。

19. Crontab 助手

按下拉框选"每天 9 点"、"每周一三五凌晨 2 点", 自动生成 cron 表达式。给不熟悉 cron 的同事临时拼一条很顺手。

20. HTTP 状态码查询

418 是什么、307 和 308 差在哪、426 怎么触发。按数字搜或按场景搜都行, 比 MDN 翻一遍快。

21. DNS 记录类型解释器

SPF / DKIM / DMARC 三件套配邮件域名时, TXT 记录里到底该写什么。CAA 记录限制证书签发的语法。这页按记录类型一个个讲, 配实际例子。

22. Linux 权限计算器

755 和 644 我背得下来, 但 1777 (sticky bit) 和 4755 (setuid) 偶尔要排错。勾选框点一下就能拿到数字, 反过来粘个数字也能解析。

5. 文本 / 数据处理 (4 款)

23. 文本去重

日志里捞出 1000 行 IP 想去重时, 这页比写 sort | uniq 还省事, 主要是它顺带告诉你原本多少行、去重后多少行、重复率多少。

24. 文本排序

按字母、按数字、按长度排; 升序降序; 反转。整理 import 语句、整理 SQL IN 列表、整理环境变量, 都在这页搞定。

25. 文本差异对比

本地没装 diff 工具时, 或者要对比的两段文本是聊天里粘过来的, 浏览器里红绿对比一下就行。行级和字符级两种粒度都支持。

26. UUID 生成器

写测试数据、初始化数据库主键、给 trace ID 填值。一次生成 1-100 个, 复制按钮一键全选。v4 是默认, v1/v7 也支持。

6. 颜色 / 设计 (4 款)

27. 颜色选择器

写 CSS 时不开 Photoshop 也能选色, HEX / RGB / HSL 三种格式同步切换。给图片用还得配合下一个工具。

28. 图片取色

设计师丢个截图过来让"按这个色调", 上传图片直接抽出 5-10 个主色, HEX 一键复制。比手动用 PS 的吸管挨个戳省事。

29. CSS 渐变生成器

linear-gradient 三个色标我能写, 但 conic-gradient 一上手就要查。这页拖滑块可视化调, 实时预览, 复制 CSS 直接粘进去。

30. 对比度检查器

WCAG AA 要求正文 4.5:1, AAA 要求 7:1。设计稿丢过来的浅灰文字一上线就被无障碍工具喷, 上线前先拿这页校一下。

怎么用最高效

我自己常用的三种组合姿势:

  1. 联调流: JSON 格式化 + JWT 解码 + HTTP 状态码 三个标签页常驻。后端给的接口不对劲时, 30 秒内能定位是协议错了、token 错了还是数据结构错了。
  2. 运维流: Cron 解释器 + Crontab 助手 + Linux 权限计算器。配定时任务前先在浏览器里把表达式算对、把权限位算对, 提交脚本时不至于第二天凌晨被报警吵醒。
  3. 设计流: 颜色选择器 + 图片取色 + 对比度检查器。前端写完一个组件后, 把截图放进去抽主色, 再把主色对背景跑一遍对比度, 不会等 PR review 时被设计师打回。

书签栏腾一栏出来, 把这 30 个钉进去, 你会发现一年之中省下来的搜索时间够你看完几本书。


Made by Toolora · Updated 2026-05-26