camelCaseをkebab-caseに変換する方法
camelCaseの名前をkebab-caseにすぐ変換できます。変数名、関数名、列名を入力するか貼り付けると、入力しながらkebab-caseの形が表示されます。
- 上の入力欄にcamelCaseの名前（例：mainNavItem）を入力するか貼り付けます。
- kebab-caseの形がすぐに表示されます：mainNavItem は main-nav-item になります。
- 結果をコピーするか、変換元と変換先で17種類の命名スタイルから選びます。
変換のしくみ
まず名前を単語に分けます。区切りは大文字、アンダースコア、ハイフン、ピリオド、空白です。次に単語をkebab-caseで書き直します：すべて小文字、ハイフンでつなぐ。HTTPのように大文字が続く部分は1つの単語として扱い、数字は直前の単語にくっついたままになります。
camelCase→kebab-case の例
| camelCase | kebab-case |
|---|---|
getUserById | get-user-by-id |
firstName | first-name |
parseHTTPResponse | parse-http-response |
isValid | is-valid |
totalPriceUsd | total-price-usd |
address2Line | address2-line |
camelCaseとkebab-caseとは
camelCaseは最初の単語を小文字で書き、以降の単語の先頭を大文字にして区切り文字なしでつなぎます。JavaScript、Java、C#、Swiftの変数名・関数名の標準です。
kebab-caseはすべての単語を小文字にしてハイフンでつなぎます。URL、CSSのクラス名、HTML属性、ファイル名で使われます。
よくある質問
HTTPやIDのような略語はどうなりますか？
大文字の連続は1つの単語として扱います。たとえばparseHTTPResponseはsnake_caseではparse_http_responseになります。
コードの意味は変わりますか？
いいえ。名前を書き換えるだけです。その名前を使っているすべての場所も忘れずに変更してください。そうしないとコードは古い名前を探してしまいます。
どのスタイルを使えばよいですか？
言語やプロジェクトの慣習に従いましょう。JavaScriptやJavaではcamelCase、Python、Ruby、SQLではsnake_case、URLやCSSではkebab-caseが一般的です。
このツールは無料ですか？
はい、無料でご利用いただけます。登録・メールアドレス不要。結果はこのページに表示されます。
結果はどこで確認できますか？
このページでツールを使用すると、結果がここに表示されます。メールで受け取る必要はありません。