開發者免費工具 — JSON、正則、雜湊、Favicon 套件、瀏覽器內執行 | ToolKoala
開發者工具包
"我自己是開發者。這些是我一直釘在瀏覽器標籤裡的工具——Favicon、JSON、正則、雜湊、編碼器。不用裝 CLI、不用註冊、零遙測。 — Milo 🐨"
這些工具大部分時候用不到。但當你某一天需要一個字串的 SHA-256，或者一個不卡的正則測試器，或者從一個 SVG 出 17 個尺寸的 favicon——你會非常需要。這一頁是策展的開發者工具架。一切都在你瀏覽器本地執行；什麼都不會回傳；沒有呼叫次數限制。
你會用得最多的 3 個工具
- JSON 格式化 / 校驗 — 貼上、美化、校驗、壓縮。處理深巢狀結構，對錯的 JSON 給清楚的錯誤提示。在你不信任終端管道輸出時用它調 API。
- 正則測試器 — 實時高亮、捕獲組、匹配數。測的是 ECMAScript flavor 正則（和你 JS 用的同一引擎）。帶快速 replace 預覽。
- Favicon 生成器 — 一張源圖 → 所有需要的尺寸（16、32、48、64、128、256、512，Apple Touch 用 180，加 manifest.json）。一個 ZIP，丟進
public/資料夾，搞定。
真實 workflow：給新 app 出 favicon 全套
常見場景：設計給你一張 SVG logo。你要給 web app、iOS 安裝橫幅、Android manifest 和 Apple Touch 出完整 favicon 套件。下面是 5 分鐘的流程：
- SVG 轉 PNG：開啟 SVG 轉 PNG，按 512×512 透明背景匯出。存為母版 PNG。
- 生成套件：把母版丟進 Favicon 生成器。得到完整套裝（favicon.ico、.png 變體、Apple Touch、manifest.json）打包 ZIP。
- 解壓到
public/：複製貼上進專案；manifest.json 裡有標準 link 標籤可以直接丟進<head>。 - 跨平臺驗證：在 Safari（Apple Touch Icon）、Android Chrome（manifest）和裸瀏覽器標籤頁（.ico fallback）都測一遍。
5 分鐘。不用 CLI。不用 npm install。沒有"免費僅限 3 次生成"的 SaaS 限制。
完整開發者工具包（按場景）
🧪 資料檢查 & 轉換
- JSON 格式化 — 美化、壓縮、校驗
- CSV ↔ JSON — 格式互轉，保留型別
- YAML ↔ JSON — 無損雙向轉換
- Markdown ↔ HTML — 快速渲染或提取
- 文字 Diff — 並排對比帶高亮
🔐 編碼 & 雜湊
- 雜湊生成器 — MD5、SHA-1、SHA-256、SHA-512 瀏覽器內運算
- URL 編碼 / 解碼 — URL 和查詢串的 percent-encoding
- 圖片轉 Base64 — 在 CSS/HTML 裡內聯圖片的 data URL
- 時間戳轉換器 — Unix ↔ ISO 8601，多時區
🎨 資產準備
- Favicon 生成器 — 一張源圖出完整 favicon 套件
- SVG 轉 PNG — 任意解析度柵格化、透明背景
- 圖片格式轉換 — HEIC、WebP、PNG、JPG 互轉
- 圖片壓縮 — 給 app/web 交付的資產壓縮
- 二維碼生成器 — URL、WiFi、聯絡人；輸出 SVG 和 PNG
🧪 速查工具
- 正則測試器 — ECMAScript flavor，實時捕獲組
- 顏色轉換器 — HEX ↔ RGB ↔ HSL ↔ 命名色
- 顏色選取器（從圖） — 從截圖裡取精確十六進位制
- 單位換算 — 位元組、時間、距離、溫度
- 字數 / 字元數 — LLM token 預算時有用
- 大小寫轉換 — camelCase ↔ snake_case ↔ kebab-case
"為啥不用 CLI 直接搞？"
說實話：對一次性操作，你不想寫 10 行 Python 指令碼，你想要 3 秒的答案。算個 token 的 SHA-256、查個正則、出一套 favicon——一個零安裝、不要 requirements.txt、不彈許可權對話方塊的瀏覽器工具，比你開啟終端還快。
另一個場景：在你裝不了軟體的機器上——借來的筆記本、公司鎖死的工位機、共享辦公空間的公共電腦。它們剛好在你日常工具箱不在的時候有用。
其他場景（批處理、指令碼、CI/CD）繼續用 CLI。這些工具是終端的補充，不是替代。
常見問題
這些工具準嗎？我的雜湊函式不能有 bug。
加密函式（MD5、SHA 系列）用的是瀏覽器原生 SubtleCrypto API——和 Chrome 處理 HTTPS 用的同一實現。正則用的是 V8 正則引擎（和 Node.js 同款）。JSON 解析用原生 JSON.parse。你的瀏覽器對，這些就對。
我的原始碼或資料會洩漏嗎？
不會。工具在你瀏覽器標籤裡執行。處理在你 CPU 上發生。可以在 DevTools → Network 面板驗證：丟檔案或貼上文字，看 network 面板——沒有任何帶你資料的出站請求。
能在指令碼或 CI 裡用嗎？
這些工具是互動式的（瀏覽器）。指令碼和 CI 用專門的 CLI 工具——它們更適合那種場景。瀏覽器工具適合"我現在就要這個答案，在這個標籤頁裡"的場景。
為啥沒有 X 工具？
告訴我。[email protected]。路線圖很大程度上是讀者驅動的；你要 JWT 解碼、YAML linter、UUID 生成器或任何其他開發者工具，會被快速安排。約束是"必須能在瀏覽器裡跑"——任何需要服務端算力（LLM 推理、大型編譯）的不行。
為啥輸出面板沒暗色/亮色主題？
有——右上角切換按鈕。設定跨訪問保留。站點預設跟你係統的 prefers-color-scheme。
釘住這一頁。你真會用到的開發者工具架。
或者直接去 正則測試器 → · JSON 格式化 →
— Milo 🐨 · [email protected]