開発者なら誰でも、すぐ手の届くところに小さなユーティリティをいくつか置いているものです。1 日に何度も無意識に開くようなツールです。この記事では、日々のよくある作業をカバーする、無料でブラウザベースのツールを 10 個厳選しました。すべてブラウザ内で動作するため、貼り付けた内容がサーバーに送信されることはありません。
「正しく動く」とは実際どういう見た目か。 このチェックリストの各ツールは、それぞれのページに検証済みの公開出力を持っています。だから壊れたツールと正しいツールを区別できます。他のツールで照合できるものを 3 つ:
helloの MD5 は5d41402abc4b2a76b9719d911017c592。JSON の末尾カンマは Expected double-quoted property name in JSON at position 7 (line 1 column 8) を出します。そして私たちのカラーピッカーは、自分たちで描いたイラストの 6 色すべてを取得します。いずれも実測ラボと各ツールページにあります。チェックリストの意義は、各項目が検証可能であることです。
1. JSON 整形
機械が生成した JSON は 1 行に詰め込まれて読みづらいことがよくあります。JSON 整形ツールは、それを見やすいインデント構造に整え、転送用に圧縮し、構文を検証してくれます。コードがエラーを吐く前に余計なカンマに気づけます。
見るべきは「エラーがどこにあるかを教えてくれるか」です。私たちのものは末尾のカンマを ✗ JSON syntax error: Expected double-quoted property name in JSON at position 7 (line 1 column 8) [L1:8] と報告します。位置のほうが文言より重要です。パーサーが報告するのは諦めた場所で、あなたが滑った場所ではありません。
2. Base64 エンコード / デコード
バイナリや特殊文字をテキストしか扱えない経路(メール、JSON、Data URI、JWT)で運ぶときは Base64 の出番です。良い Base64 ツールは UTF-8 に完全対応し(日本語や絵文字も往復で壊れません)、URL-safe モードも備えています。
エンコーダーが UTF-8 を正しく扱っているかの手早い確認:Hello, World! は SGVsbG8sIFdvcmxkIQ== として返らなければなりません。より短いものを返すツールは、感嘆符を落としたかバイト長を誤っています。
3. ハッシュ生成
ダウンロードしたファイルの検証、2 つのデータの照合、ハッシュの仕組みの学習に。ブラウザ標準の Web Crypto API を使うハッシュ生成ツールなら、入力を送信せずに SHA-256 や SHA-512 を即座に計算できます。
オフラインで再現できる値でハッシュツールを検証してください。hell0 の MD5 は 73b43f17232b391b9123adf40c1b65dd —— hello と 1 文字違いで、ダイジェストには共通部分がありません。チェックサムをそのツールに任せる前に確認すべき、なだれ効果です。
4. UUID 生成
データベースのキーやテストデータ用に一意な識別子をまとめて欲しいときは、UUID ジェネレーターが暗号乱数を使って RFC 4122 v4 の ID を一度に生成します。
テストすべき性質は「乱数らしく見えるか」ではなく「形式が正しいか」です。私たちのものは 1000 個の識別子を生成し、1000/1000 が一意、すべて 36 文字、バージョン数字はすべて 4 でした。
5. Unix タイムスタンプ変換
ログや API は時刻を Unix タイムスタンプで保存しがちで、人間には一目で読めません。タイムスタンプ変換ツールは、その数値をローカルと UTC の日時に変換し(逆変換も)、現在のタイムスタンプもリアルタイム表示します。
最も時間を節約する機能は、ローカル時刻と UTC を同時に表示することです。1767225600 は私たちの端末で ローカル時刻:2026-01-01 08:00:00 UTC:2026-01-01 00:00:00 を返します。2 行の差がオフセットで、タイムスタンプのバグはすべてその差に住んでいます。
6. 文字数カウント
論文、SEO 記事の長さ調整、文字数制限内に収めたい投稿など、文字数カウントツールは入力と同時に文字数・文字・文・段落・読了時間を計算します。
何を数えているかを問うべきです。3 文の英語の段落は 33 語、169 文字、空白なし 137 文字を返しました。3 つの数値は設計上食い違っており、そのうち 1 つだけを見せるツールは、その食い違いを隠しています。
7. 大文字小文字変換
変数名の変更や見出しの整形に。大文字小文字変換ツールは camelCase、snake_case、kebab-case、Title Case などをワンクリックで切り替えます。
識別子を任せる前に、略語で試してください。HTTP response code は私たちのもので PascalCase が HttpResponseCode、snake_case が http_response_code になります。略語は平坦化されます。多くのスタイルガイドが望む形ですが、それでも自分の目で確認すべき決定です。
8. URL エンコード / デコード
特殊文字や非 ASCII 文字は URL を壊します。URL エンコードツールはクエリパラメータを正しくパーセントエンコードし、アドレスバーからコピーした %XX 文字列を解読します。
正しいエンコーダーと手抜きのエンコーダーを分ける試験例はクエリ文字列です。?q=x&r=y は %3Fq%3Dx%26r%3Dy として完全にエスケープされなければなりません。? や & をそのまま残すツールは、1 つの値を URL 全体のように扱っています。
9. Diff / テキスト比較ツール
2 つのファイルが「同じに見える」のに動作が違うとき、diff ツールは変わった文字を正確にハイライトします。(当ツール集にも近日追加予定。)
「1 行変更」ではなく「1 行挿入」の扱いを見てください。私たちのものは alpha + beta gamma を返します。印付きの行が 1 つで隣は無印。それが本当の挿入と変更の見分け方です。
10. 正規表現テスター
正規表現は強力ですが間違えやすいものです。入力しながらマッチをハイライトするテスターは、試行錯誤を「筋道立てて考えられるもの」に変えます。(近日追加予定。)
本当に重要な機能は、件数だけでなくマッチ位置を示すことです。<b>bold</b> and <i>it</i> に対して非貪欲な <.+?> は私たちのもので 4 件マッチ と報告し、#1"<b>"@0 #2"</b>"@7 #3"<i>"@16 #4"</i>"@21 と列挙します。そのオフセットこそ、貪欲版が文字列全体を飲み込んだと分かる根拠です。
良いオンラインツールの選び方
「無料」なら何でも同じ、というわけではありません。確認したいポイント:
- ローカルで動くか? 上記のようにブラウザ内でデータを処理するツールなら、入力が端末を離れることはありません。機密情報を扱うときに重要です。
- 速いか? 静的で CDN 配信のツールは瞬時に表示され、通信の往復なしに反応します。
- 限界を正直に示しているか? 例えば MD5 が安全でないから対応しない、というハッシュツールは有用な情報を教えてくれています。
よく使うものをブックマークしておけば、1 日の摩擦が驚くほど減ります。以上のツールはすべて無料・プライバシー優先で、Yunknow Toolbox で使えます。