Web ToolBox

更新履歴

🔄 データ変換系ツールを更新しました

  • CSV to JSON変換を更新しました

    • 変換できないときに、引用符の閉じ忘れや列数のずれなど、原因が分かるようになりました

  • JSON to CSV変換を更新しました

    • 入れ子のオブジェクトや配列は、JSON文字列としてセルに出力されます
    • オブジェクト以外のJSONは、変換できない理由が表示されます

  • YAML to JSON変換を更新しました

    • yesやno、日付を文字列として扱うようになりました

  • ASCII to HEX変換を更新しました

    • 日本語などのマルチバイト文字もUTF-8のバイト列として変換できるようになりました
    • 0x形式の出力がスペースで区切られるようになりました

  • HEX to ASCII変換を更新しました

    • 日本語などのマルチバイト文字も、欠けずに元のテキストへ戻せるようになりました
    • 変換できない値はスキップされ、テキストとして読めないバイトは置換文字で表示されます

  • Base64デコードを更新しました

    • 不正なBase64やテキストとして読めないデータのときに、理由が表示されるようになりました
    • 行単位の変換で、変換できなかった行を確認しながら他の行を読めるようになりました

  • URLエンコード・デコードを更新しました

    • クエリ値とURL全体を選んで変換できるようになりました
    • クエリ文字列の+を空白としてデコードできるようになりました
    • 変換できない行があっても、他の行の結果を確認できるようになりました

  • 基数変換を更新しました

    • 64ビットを超える大きな値も正確に変換できるようになりました
    • 0b・0o・0xの接頭辞が付いた値もそのまま変換できます

🔄 コード系ツールを更新しました

  • JSON整形を更新しました

    • キー並べ替えに対応しました
    • エラー箇所を行と列で確認できるようになりました
    • よくある入力ミスを自動で修復できるようになりました

  • JWTデコーダーを更新しました

    • 有効期限などの時刻情報を日時で確認できるようになりました
    • エラー内容を日本語で確認できるようになりました

  • UUIDバリデーターを更新しました

    • 入力すると検証結果が自動で表示されるようになりました

🔄 セキュリティ系ツールを更新しました

  • パスワードジェネレーターを更新しました

    • 設定を変えるとパスワードが自動で作り直されるようになりました
    • 生成したパスワードを1行ずつコピーしたり、まとめてコピーやCSV保存ができるようになりました

  • UUID/GUIDジェネレーターを更新しました

    • バージョンはv4とv7に対応しました
    • 生成数を最大1000件まで指定でき、結果を一覧からコピーやCSV保存できるようになりました

  • ULIDジェネレーターを更新しました

    • 生成方法をデフォルト・タイムシード・単調増加から選べるようになりました
    • 生成数を最大1000件まで指定でき、結果を一覧からコピーやCSV保存できるようになりました

  • SHAハッシュジェネレーターを更新しました

    • SHA-256・SHA-512・SHA-384・SHA-1・MD5をまとめて計算し、一覧で確認できるようになりました
    • 出力形式を小文字HEX・大文字HEX・Base64から選べるようになりました

  • CSPパーサーを更新しました

    • 診断結果とポリシー内訳をカードの一覧で確認できるようになりました
    • サンプルボタンで機能をすぐ試せるようになりました

  • クレジットカードバリデーターを更新しました

    • 判定条件の内訳とLuhnチェックの計算過程を確認できるようになりました
    • テスト番号の入力と番号の表示切り替え・自動整形に対応しました

🔄 計算系ツールを更新しました

  • アスペクト比計算を更新しました

    • 2つのタブを1つの画面にまとめました
    • プリセットを選ぶと長辺を保ったまま寸法を更新できるようにしました
    • 求めた比率をCSSのaspect-ratioやTailwindクラスとしてコピーできるようにしました
    • 向きとプレビューで比率の形を確認できるようにしました

  • 黄金比計算を更新しました

    • 選べる比率を入れ替え、第2白銀比と青銅比を追加しました
    • 長辺・短辺・全体のいずれかを入力すると、残りの寸法を自動で計算できるようになりました

  • ネストBorder-Radius最適化を更新しました

    • 外側から内側、内側から外側の両方向で計算できるようにしました
    • 余白を全周均等または縦横の2値で指定できるようにしました
    • よく使う角丸と余白の組み合わせを選べるようにしました

  • パーセンテージ・PX計算を更新しました

    • パーセンテージとPX値のどちらかを入力すると、もう片方が自動で更新されるようにしました
    • よく使う割合の一覧から、各行の値を直接コピーできるようにしました
    • 小数点以下の桁数設定を廃止し、パーセンテージは2桁、PX値は1桁に固定しました

  • PX・Rem計算を更新しました

    • px値とrem値のどちらかを入力すると、もう片方が自動で更新されるようにしました
    • よく使うpx値の一覧から、各行のrem値を直接コピーできるようにしました
    • 小数点以下の桁数設定を廃止し、最大4桁・末尾の0なしに統一しました

🔄 ネットワーク系ツールを更新しました

  • IPアドレスチェッカーを更新しました

    • IPv4とIPv6のそれぞれで通信できるかを確認できるようにしました
    • 接続元のISP（ASN）・国・都市と、サーバーが受け取ったUser-AgentやHTTPプロトコル・TLSバージョンを表示するようにしました

  • サブドメイン検索を更新しました

    • 結果の絞り込み、並べ替え、表示中の行のまとめコピーができるようにしました
    • URLをそのまま貼り付けても検索できるようにしました

🔄 テキスト系ツールを更新しました

  • 文字数カウンターを更新しました

    • 絵文字や一部の漢字を1文字として数える方式に変更しました
    • 行数は末尾の改行を空行として数えないようにしました

  • 英単語カウンターを更新しました

    • 縮約形やアクセント付きの語を正しく1語として数えるようにしました
    • テキスト分析に語彙多様性を追加しました
    • 行数は末尾の改行を空行として数えないようにしました
    • 単語一覧の検索と、スピーチ時間を追加しました
    • 読書速度の既定を225語/分に変更し、遅め・標準・速めのプリセットを追加しました

  • HTMLタグ除去ツールを更新しました

    • 段落や見出しの区切りを改行として残し、&のような記号を元の文字に戻すようにしました
    • scriptやstyleの中身を除くようにしました
    • 文字数の表示と、改行・余白・script/styleを切り替える設定を追加しました

  • 改行・空白・タブ文字除去ツールを更新しました

    • 改行をスペースに置き換えて行をつなげられるようにしました
    • NBSPなど見えない空白文字を除去する設定を追加しました

  • テキスト行結合ツールを更新しました

    • 末尾の改行を空行として数えないようにしました

  • テキストソーターを更新しました

    • ランダム並び替えを廃止しました
    • 空行を除外する設定と、行の前後の空白を削除する設定を追加しました
    • 空白の違いだけで重複する行を1つにまとめるようにしました

  • テキスト重複行除去ツールを更新しました

    • 改行コードの違いでも正しく重複を除去するようにしました
    • 末尾の改行を空行として数えないようにしました

  • テキスト行頭・行末追加ツールを更新しました

    • 末尾の改行で余計な行が追加されないようにしました

  • テキストケース変換ツールを更新しました

    • 複数行の入力を、行ごとに変換して並べるようにしました
    • SCREAMING_SNAKE_CASEを追加しました

  • Lorem Ipsum ジェネレーターを更新しました

    • 和文を、夏目漱石や宮沢賢治などの書き出しが含まれる実文コーパスから組み立てるようにしました
    • 段落や文ごとにコピーできるようになりました

  • テキスト差分チェッカーを更新しました

    • 差分がリアルタイムで表示されるようになり、「比較する」ボタンがなくなりました
    • 変更行の中の変化した文字を強調できるようになりました
    • 差分ブロック間をボタンやAlt+↑↓で移動できるようになりました
    • 差分をunified diffの形式でコピーできるようになりました

🔧 改善

  • ツールのカテゴリを再編し、機能ではなく扱う対象で分類するようにしました

  • タグを機能ベースに整理しました

    • カテゴリと重複していたタグを削除し、生成・変換・整形などの機能タグに統一しました
    • ツールページの関連ツールが、より近い分野のツールを表示するようになりました

💅 サイト全体のデザインを刷新しました

  • ツールカード、ツールページ、トップページなど主要な画面を再設計しました
  • 余白や幅の取り方を整理し、見出しや説明、操作ボタンの並びを揃えました
  • ツールアイコン、ロゴ、見出しのフォントを刷新しました

🔜 今後の予定

ツールの機能とデザインの改善を進めています。使い勝手のよい更新を少しずつ反映していく予定です。

🔧 改善

  • 英単語カウンターの単語出現頻度に比率列と密度列を追加しました

    • 比率列はソートとCSV出力に対応しています
    • 密度列のバーで出現頻度の偏りを確認できます

💅 UI/UX

  • JSON to TOON変換とTOON to JSON変換を最新のTOON仕様に合わせて更新し、キーフォールディングとパス展開の設定を削除しました

    • 出力は常にネスト構造となり、ドット記法はリテラルキーとして扱われます

💅 UI/UX

  • カラーコントラストチェッカーのデザインを刷新しました

    • 有名ブランドの配色をワンクリックで試せるプリセットを追加しました
    • 見出しや本文を含むライブプレビューカードで、実際のUIに近い見え方を確認できるようになりました

💅 UI/UX

  • 設定サイドバーを追加しました。
    テーマや言語、プライマリカラーに加え、フォント切り替えやリロード防止などの新しい設定を追加しました。
    ヘッダーの設定アイコンからいつでも利用できます。

✨ 新しいツール

🎉 公開ツール数が80になりました。

  • Squircleジェネレーターを追加しました

    • squircleの clip-path やSVGコードを生成し、アイコンやカードの輪郭を調整できます

  • テキスト分割を追加しました

    • 区切り文字でテキストを1行ずつ分割し、空の項目の除外や区切り文字を残した出力に対応しています

🔧 改善

  • UUIDバリデーターにCSV出力機能を追加し、空行が検証対象に含まれる問題を修正しました

💅 UI/UX

  • OGPチェッカー と OGP画像シミュレーター のプレビュー周りと編集UIを改善しました

    • プレビューエリアの表示を改善し、X と Facebook の見え方を揃えました
    • OGP画像シミュレーターのメタ情報編集と画像選択UIを整理し、画像の追加・削除に対応しました

💅 UI/UX

  • カラースポイトの色抽出UIを改善しました

    • プレビュー上でクロスヘアと拡大レンズを見ながら色を選べるようにしました
    • 画像上を続けてクリックしながら、必要な色を連続して抽出できるようにしました

英単語カウンター機能強化

英単語カウンターに新機能を追加し、より詳細なテキスト分析が可能になりました。

新機能

  • 読書速度（WPM）設定 - 100〜600の範囲で調整可能。読了時間の計算に反映されます
  • ストップワード除外 - the, is, atなどの機能語を単語出現頻度から除外できるようになりました
  • 大文字小文字の区別オプション - 単語出現頻度で大文字・小文字を区別するか選択可能に。※デフォルトが「区別しない」に変更されました（破壊的変更）。従来の動作が必要な場合はオプションをONにしてください

改善

  • 文の検出精度を向上（Dr.やMr.などの略語、省略符号を正しく処理）
  • UIレイアウトを改善し、カウント結果をグリッド形式で見やすく表示

UIを改善しました

  • 全体的にツールのデザインを改善しました
  • ツールドキュメントのスタイルを調整し、読みやすくしました

✨ 新しいツール

  • ネストBorder-Radius最適化ツールを追加しました

    • 外側と内側のborder-radiusを視覚的に調整し完璧なネストされたBorder-Radiusを生成するツールです。

  • PX to Rem計算機を追加しました

    • PXとRemの相互変換ができるシンプルなツールです。

✨ 新機能

  • ピクセルアート変換ツールを追加しました

    • 写真やイラストをレトロなドット絵風に変換（2つの変換モードと7段階のサイズ調整）
    • リアルタイムプレビューで設定を変更しながら仕上がりを確認

🚀 インフラの変更

ユーザーの皆さまには直接関わることではないのですが、サイトのインフラをAWS（S3 + Lambda）からCloudflare Workersに移行しました😁

フロントエンドとバックエンドのコードベースが統一できるようになり、開発効率の向上や、これまでにない新しいツールなども提供できるかもしれません。

※皆さまには特別な対応は不要で、これまで通りご利用いただけます。

✨ 新しいツール

  • クレジットカードバリデーターを追加しました

    • クレジットカード番号をLuhnアルゴリズムでチェックできます
    • Visa、MasterCard、American Expressなどのカードブランドを自動で識別できます

✨ 新しいツール

  • HTMLタグ除去ツールを追加しました

    • HTMLタグを除去し、テキストだけを抽出できます
    • タグの選択的な保持やコメント処理などのオプションにも対応しています

  • CSV to JSON変換ツールを追加しました

    • CSVデータをJSON形式へ変換できます

✨ 機能強化

  • 英単語カウンターの機能強化

    • テキスト分析機能を強化し、さらに詳細な情報を表示するようになりました
    • 段落分析と文分析の項目を追加し、文章構造の把握が容易になりました

  • カラーテーマの強化

    • よりモダンでコントラストの高い、shadcn-ライクなBlackテーマを追加しました

🐛 バグ修正

  • いくつかの軽微なUIの問題を修正し、ユーザーエクスペリエンスを向上させました

✨ 新機能

  • **テキスト行結合ツール**を追加しました

    • 複数行のテキストを一行に結合でき、区切り文字の指定や空行の自動スキップにも対応しています

  • **テキスト重複行除去ツール**を追加しました

    • テキスト内の重複行を削除でき、大文字小文字の区別や空白行の扱いも調整できます

🔧 改善点

  • ツールのカテゴリ分類を見直し、より直感的なナビゲーションを実現

    • 関連性の高いツール同士をグループ化
    • カテゴリラベルの最適化
    • ツール検索機能の精度向上

👀ハイライト

UIフレームワークをNuxt UI v3に更新しました！
更新にともない、サイト全体のコードを見直し、いくつかのツールで内部処理の改善をしています。

また、トップページのデザインをリニューアルしました😊

✨ 新しいツール

数値順・アルファベット順・カスタム順序など様々な条件でテキストを並び替えします。

🔧 改善点

👀ハイライト

✨ CSSフィルタージェネレーターが追加されました

  • CSSフィルタージェネレーター

    • リアルタイムでフィルターの調整結果を確認できます
    • ぼかし、明るさ、コントラスト、彩度などをスライダーで調整できます

✨画像比較スライダーツールを強化

画像比較スライダーツールで、画像の見た目だけでなく、ファイルサイズや更新日時、画像の縦横サイズ等の詳細も簡単に比較できるようになりました！

また、冗長なUIを改善し、より少ないステップでツールを利用できるようになりました。

その他の更新

  • 画像Base64エンコードツールで複数の画像を変換する際のパフォーマンスが向上しました。

✨ 新しいツール

🔥ツールカテゴリを整理

さらに使いやすくするため、新しい「カラーツール」カテゴリを追加しました。このカテゴリでは色に関する便利なツールをまとめてご利用いただけます。また、いくつかのツールを適切なカテゴリに整理し、探しやすさを向上させました。

これからも継続的にツールやカテゴリの改善を行っていきますので、ぜひお試しください！

✨ 新しいツール

  • SVG to CSS

    • SVGデータをCSSのbackground-imageとして使える形式へ変換できます

🔥機能強化

テキストエリアを使用するツールに、新たに「ファイルからの入力」機能を追加しました。これにより、直接テキストを入力するだけでなく、ファイルをアップロードしてその内容を簡単に読み込むことができます。複数のファイルソースに対応しており、効率的なデータ入力が可能になりました！

ポリシーの改定

プライバシーポリシーおよび、免責事項について一部の記載を更新しました。

✨基数変換ツールを改善

基数変換ツールに数値のフォーマット切替オプションを追加しました🎉
2進数と16進数は4桁ごと、8進数は3桁ごとに区切ることができます。これにより数値の読みやすさが向上しました。

その他の変更

  • サイトの様々なUIを改善

ツールの強化✨

利便性向上の理由で、JSON・YAML相互変換ツールをそれぞれの一方への変換を行う2つのツールへ分離しました。

また、JSON to YAMLツールは変換時にいくつかのオプションを指定可能になりました。

その他変更

  • サイト全体のUIを調整
  • ライブラリのアップデート
  • 新しいOGイメージ

✨ 新しいツール

  • テキストDIFFチェッカーを追加しました

    • 2つのテキストを並べて比較し、差分を視覚的に確認できます
    • 文書の変更確認やコードの比較など、細かな違いを見たい場面で使えます
    • 比較処理はブラウザ内で完結するため、入力データを手元でそのまま扱えます

👀 ハイライト

Web ToolBoxのUIフレームワークをVuetifyからNuxtUIへ移行し、サイト全体を大きく見直しました。
見た目だけでなく、操作しやすさや今後の改善・拡張のしやすさも含めて土台から更新しています。

この更新にあわせてコードベースも広く整理し、多くの画面やツールを再構成しました。ここに載せていない細かな改善も含めて、全体の使い勝手を整えています。

🔧 ツールの改善

💖 お気に入り機能を追加

ツールをお気に入り登録できるようになりました。
登録したツールはサイドナビゲーションからすぐに開けるため、よく使うツールへアクセスしやすくなっています。

🎨 テーマ機能を追加（実験的）

サイトのテーマカラーを切り替えられる機能を追加しました。
ヘッダーメニューのカラーパレットから、Indigo、Blue、Green、Emerald、Amber、Slateの6色を選べます。

※テーマ機能は実験的なため、今後内容が変わる可能性があります

✨ 新しいツール

どちらもシンプルに使えるツールで、日常的なテキスト処理やURL確認に役立ちます。

🔧 ツールの改善

  • いくつかのツールで機能や内部処理を見直しました
  • 細かな変更の掲載は整理し、今後は大きな更新をこのページで追いやすくしました

🎨 UIの改善

  • 言語切替メニューから国旗表示を外しました
  • TwitterのアイコンをXへ差し替えました
  • そのほか、サイト全体のUIを細かく調整しました

🐛 バグの修正

  • いくつかのツールと内部処理の不具合を修正しました

画像Base64エンコードツールを改善

画像Base64エンコードツールの出力形式を拡張し、変換後のBase64データを複数のフォーマットで使えるようにしました。

  • Base64生データ
  • Data URI付きBase64データ
  • HTMLのIMGタグ
  • CSSのbackground-imageプロパティ

用途にあわせて形式を選びやすくなり、画像をそのままWeb制作や実装作業へ流用しやすくなっています。
あわせて出力結果まわりのUIや内部処理も見直し、使い勝手とパフォーマンスを改善しました。

デザインの変更

サイト全体のデザインも細かく調整しました。

バグの修正

  • OGP画像シミュレーターツールで正しくOGP画像が描画されない場合がある事象を修正
  • Base64エンコードツールで常にURLセーフ形式の変換となっていたバグを修正
  • そのほか、細かな不具合も修正しました

✨ 新しいツール

色の確認や抽出に使える2つのツールを追加しました。

  • カラースポイト - 画像から色を抽出

    • 画像上の気になる色をスポイトで拾い、そのまま色コードとして確認できるツールです
    • ブラウザのEyeDropper APIを利用しているため一部制限はありますが、画像から色を手早く確認したいときに便利です

  • カラーコード抽出

    • 画像に使われている色をまとめて抽出できるツールです
    • 抽出オプションを調整しながら、画像に含まれる色の傾向をすばやく確認できます

フレームワークのアップグレード

内部的な更新として、利用しているフレームワークも見直しました。

  • フレームワーク(Nuxt)を現時点の最新へアップグレード
  • UIフレームワーク(Vuetify)を現時点の最新へアップグレード

これにより、サイト全体のパフォーマンス向上にもつながっています。

サービス公開以来の最大のアップデート

Web ToolBoxの公開以来でも、特に大きな更新となりました。
これまで積み重ねてきたツール追加や機能改善に加えて、今回はサイト全体の土台から見直しています。

主な変更点は次のとおりです。

  • Nuxt2(Nuxt bridge)からNuxt3へのアップデート
  • Vuetify2からVuetify3へのアップデート
  • 各種ライブラリのアップデート
  • ツールの機能強化・改善
  • パフォーマンスの改善
  • よりユーザーフレンドリーなインタフェース・カラー

大規模アップデートの理由

今回の更新では、Nuxt3やVuetify3への移行を中心に、古くなっていた構成をまとめて見直しました。
新しいバージョンへの追従だけでなく、今後もツールを追加・改善しやすい形へ整えることが目的です。

移行にあたっては破壊的変更も多く、関連ライブラリの更新も含めて大きな作業になりましたが、構成を整理しながらコードベースを全面的に見直すことで、使いやすさとパフォーマンスの両方を改善できました。

今回は新しいツールの追加はありませんが、今後に向けた土台づくりとして大きな節目になる更新です。
追加したいツールやいただいているリクエストもあるため、今後も少しずつ拡充していく予定です。