テキストケース変換ツール｜10種類のケース形式をボタン1つで切り替え

入力したテキストを UPPERCASE、lowercase、Title Case、camelCase、snake_case、kebab-case など10種類のケース形式へワンクリックで変換します。文字数・単語数も同時に表示されるため、変数名やファイル名の命名規則をそろえる作業に向いています。

💡 このツールについて

コードを書いていると「ここは camelCase、設定ファイルは snake_case、CSS クラスは kebab-case」と、場所によって命名規則が変わって手が止まることがあります。手作業でアンダースコアやハイフンを打ち直すと、1文字ずれただけで参照が壊れて原因探しに時間を取られます。

このツールは入力したフレーズを単語に分解し、選んだ形式のルールで連結し直します。getUserName のように既に連結された識別子も大文字の切れ目で単語に割り、get_user_name や GET_USER_NAME へ変換できます。逆に user-profile-card のようにハイフン区切りの文字列を camelCase に戻すこともできます。プログラマだけでなく、見出しを Title Case にそろえたいライターや、ドキュメントの表記ゆれを整える編集担当にも使えます。

🧐 よくある質問

Q. camelCase と PascalCase の違いは何ですか? A. どちらも単語の区切りを大文字で表しますが、先頭文字の扱いが異なります。userName のように先頭を小文字にするのが camelCase、UserName のように先頭も大文字にするのが PascalCase（アッパーキャメル）です。

Q. 既に snake_case になっている文字列を kebab-case に変えられますか? A. できます。アンダースコア・ハイフン・ドットはいずれも単語の区切りとして認識するので、my_variable_name を選び直すだけで my-variable-name や myVariableName へ変換できます。

Q. 日本語や記号混じりのテキストはどうなりますか? A. UPPERCASE / lowercase / Title Case は英字部分のみ大文字小文字が切り替わり、日本語はそのまま残ります。camelCase 系は半角スペースや区切り文字を境に単語を結合するため、英数字中心のテキストで安定します。

Q. 入力したテキストはどこかに送信されますか? A. 変換はすべてブラウザ内のJavaScriptで処理され、入力内容が外部へ送られることはありません。

📚 命名規則が言語ごとに違う理由

snake_case は Python や Ruby、データベースのカラム名で広く使われ、kebab-case は URL や CSS クラス、HTML 属性でよく見かけます。camelCase は JavaScript や Java の変数・メソッド名、PascalCase はクラス名やコンポーネント名に使われるのが一般的です。CONSTANT_CASE（全大文字 + アンダースコア）は環境変数や定数の慣習です。

これらは「どれが正しい」というより、各言語コミュニティが長年積み重ねたスタイルガイドの結果です。混在したコードベースを引き継いだときは、まず使われている規則を見極め、機械的に変換してそろえると差分が読みやすくなります。