命名規則変換ツール｜camelCase・snake_case・kebab-case を一括変換

camelCase・PascalCase・snake_case・kebab-case・SCREAMING_SNAKE など8形式を同時に変換できる無料オンラインツール。入力した瞬間に全形式を表示します。

ブラウザ内処理完全無料登録不要

変換したいテキスト

このツールについて

使い方・特徴・補足情報

命名規則変換ツールとは

命名規則変換ツールは、変数名や関数名のケースを8種類の形式に一括変換するツールです。1回入力すると全形式が並びます。

キャメル・パスカル・スネーク・ケバブ・大文字スネークなど、言語ごとに違う命名規則をまとめて出します。

入力がどの形式で書かれているかは自動で判別し、使いたい形式をワンクリックでコピーできます。

処理はすべてブラウザ内で完結し、コードを外部へ送りません。社内のソースに含む変数名も、手元だけで変換できます。

👤 こんな人におすすめ✨

コードを書く開発者

✅ 楽になること

命名規則（ケース）の一括変換

✍️ 避けたい手間

命名スタイルの不統一

解決できる困りごと

変数名のスタイルを揃え忘れて lint に怒られる手間を減らせる
既存コードベースに合わせた命名規則を見比べながら決めやすくなる
複数の命名形式を一覧で確認できるので、レビュー前の表記ゆれを防ぎやすい

使い方

入力欄に変換したいテキストを入力またはペーストします（camelCase・snake_case・スペース区切りなど、どの形式でも可）。
入力と同時に、8種類の命名規則（camel・Pascal・snake・kebab・SCREAMING・Title・lower・upper）に変換した結果が一覧表示されます。
使いたい形式の「コピー」ボタンをクリックして結果をクリップボードにコピーします。
入力欄上部の「検出形式」表示で、入力テキストの命名規則が自動識別されます。

使用例

snake_case の DB カラム名を全形式に展開

PostgreSQL の user_profile_image カラムを、フロントエンド・クラス名・CSS クラスなどそれぞれの慣例に合わせて変換する例です。

入力

user_profile_image

出力

camelCase:            userProfileImage
PascalCase:           UserProfileImage
snake_case:           user_profile_image
kebab-case:           user-profile-image
SCREAMING_SNAKE_CASE: USER_PROFILE_IMAGE
Title Case:           User Profile Image
lower case:           user profile image
UPPER CASE:           USER PROFILE IMAGE

PascalCase のクラス名から定数名へ

React コンポーネント MaxRetryCount を環境変数や定数として再利用するため、SCREAMING_SNAKE_CASE と kebab-case を同時に取得する例です。

入力

MaxRetryCount

出力

camelCase:            maxRetryCount
snake_case:           max_retry_count
kebab-case:           max-retry-count
SCREAMING_SNAKE_CASE: MAX_RETRY_COUNT

略語混在 (HTMLParser) の正しい分割

連続する大文字（HTML）と通常の単語（Parser）が混ざった文字列を正しく分割できることを確認する例です。HTMLParser を html-parser などに変換するときの境界判定をチェックします。

入力

HTMLParser

出力

camelCase:   htmlParser
PascalCase:  HtmlParser
snake_case:  html_parser
kebab-case:  html-parser

活用シーン

APIレスポンスのキー名変換

スネークの JSON をキャメルで扱うときの対応確認に使えます。user_profile_image を入れれば camel と Pascal が出ます。

CSSクラス名と変数名の相互変換

CSS の primary-button と props の primaryButton を行き来するのに向きます。変換後の各形式をワンクリックでコピーできます。

定数名と変数名の統一チェック

定数の MAX_RETRY_COUNT と変数の maxRetryCount の整合を素早く確認できます。片方を入れれば、もう一方の正しい表記が出ます。

DBカラム名と変数名の変換

created_at カラムを ORM の createdAt へ直すときの確認に使えます。スキーマ設計でカラム名の各形式をまとめて見られます。

命名規則の学習・確認

「この言語では変数名をどう書くか」を、単語を入れて出力で見比べられます。言語ごとの慣例の違いを、手を動かして学べます。

技術的な解説

補足: 仕組み

分割には正規表現を使います。([a-z0-9])([A-Z]) で小文字から大文字への境界を検出し、区切り記号でも分けて単語配列を作ります。

変換はこの単語配列を経由します。キャメルは2語目以降の先頭を toUpperCase() で大文字化し、スネークは小文字を _ で結合します。

入力形式の自動判別も RegExp で行い、区切り記号や大小の並びから形式を推定します。

もっと詳しく

連続する大文字（略語）の分割が難しい理由

命名変換で壊れやすいのが HTMLParser のような略語混じりの語です。単純に大文字の前で区切ると、H-T-M-L-Parser と1文字ずつバラけます。

本ツールは「大文字の連続＋次の単語の先頭」を正規表現で検出し、HTML と Parser の境界を見分けます。意図通り1語になったかは、変換前に出力を一度確認すると安全です。

言語ごとの命名規則の慣例

同じ概念でも言語で推奨形が違います。JS は変数がキャメル・クラスがパスカル、Python は変数がスネーク・定数が大文字スネークです。

本ツールは8形式を一度に並べます。API のスネークのキーをフロントのキャメルへ写す対応表として使え、lint 設定に合う形式を迷わず選べます。

よくある質問

どんな形式のテキストを入力できますか？

camelCase・snake_case・kebab-case・スペース区切りなど、ほとんどの命名形式を受け付けます。形式が混在していても、自動で単語に分割して変換します。

日本語や数字を含む文字列にも対応していますか？

数字（例: userV2Api）は前後の区切りに合わせて分割します。日本語は1トークンとして保持しますが、変換は英数字前提のため、英語の識別子での利用を推奨します。

入力したコードはサーバーに送られますか？

いいえ、すべての処理はブラウザ内の JavaScript で完結します。外部へ送信しないため、社内のソースコードや機密を含む変数名でも手元だけで変換できます。