Text Case Converter

Convert text between camelCase, snake_case, kebab-case, PascalCase, CONSTANT_CASE and 8 more. Browser-only.

text-regex

Text Case Converter

camelCase
PascalCase
snake_case
kebab-case
CONSTANT_CASE
dot.case
path/case
Sentence case
Capital Case
Train-Case
UPPERCASE
lowercase

Runs entirely in your browser. Your input never leaves your device.

What next?

How it works

What "case" actually means in code

When a name contains multiple words, you need a separator and a casing rule. Different language communities settled on different combinations, and the conventions are remarkably stable across decades of code:

  • JavaScript / Java / Swift: camelCase for variables and functions, PascalCase for types and classes.
  • Python / Ruby / Rust: snake_case for variables and functions, PascalCase for classes.
  • CSS / HTML attributes / URLs: kebab-case because the space character is reserved.
  • Environment variables / SQL keywords / Constants: CONSTANT_CASE (or SCREAMING_SNAKE).
  • Filesystem paths: path/case with / separators.
  • Dot notation (config keys, namespaces): dot.case.

Pick the convention of the file you're editing. Don't fight it — convention is what lets code read like prose to people who know the language.

When you'll reach for a converter

  • Generating env vars from config keys (api.timeoutAPI_TIMEOUT).
  • Building CSS class names from React component props (primaryButtonprimary-button).
  • Naming database columns from object properties (firstNamefirst_name).
  • Cross-language code generation (TypeScript → Python ORM, Swagger → JS client).
  • Renaming variables consistently across a refactor.

The acronym trap

What's the snake_case version of XMLHttpRequest? Two reasonable answers:

  • xml_http_request — treat each acronym as a separate word
  • x_m_l_http_request — treat each capital letter as a word boundary

Most modern libraries (including the one this tool wraps, change-case) do the first — they recognize runs of capital letters as a single acronym. This is the convention you almost always want. If a library produces the second form, switch libraries.

The corresponding camelCase: xmlHttpRequest. PascalCase: XmlHttpRequest. Note the lowercase letters inside the acronym — that's deliberate and matches how the browser actually exposes the name (window.xmlHttpRequest after Babel transforms, etc.).

Common patterns by ecosystem

| Use case | Convention | Example | |---|---|---| | JS variable | camelCase | firstName | | JS class/type | PascalCase | UserService | | JS const (global) | CONSTANT_CASE | MAX_RETRIES | | Python variable | snake_case | first_name | | Python class | PascalCase | UserService | | CSS class | kebab-case | btn-primary | | HTML attribute | kebab-case | data-user-id | | URL slug | kebab-case | /my-blog-post | | Filename | kebab-case (web), snake_case (Python) | user-profile.tsx / user_profile.py | | Env var | CONSTANT_CASE | DATABASE_URL | | GraphQL field | camelCase | userName | | JSON API field | camelCase or snake_case (project choice) | firstName / first_name |

File case sensitivity

macOS by default has a case-insensitive filesystem (HFS+/APFS formatted that way). Linux is case-sensitive. Windows NTFS is case-insensitive but case-preserving. This bites cross-platform projects: a file named Button.tsx imported as ./button.tsx works on macOS, breaks in CI on Linux. Set your CI to Linux from day one to catch this immediately.

How this tool helps

  • Paste text once, see all 12 case variants at the same time.
  • Click any output to copy.
  • Handles acronyms correctly (uses change-case).
  • Works on multi-line input (each line converted independently).

Related tools

  • Slugify — when you need URL-safe output (handles diacritics, unicode, emoji).
  • Regex Tester — when you need to find/replace case patterns programmatically.

FAQ

camelCase vs PascalCase?

Same word boundaries, different first character. helloWorld is camelCase (lowercase first), HelloWorld is PascalCase (uppercase first). JavaScript/Java convention: camelCase for variables, PascalCase for classes/types.

Why does CSS use kebab-case?

Because _ and other characters had specific meanings in early CSS, and - was already used as a syntax character. Modern CSS still uses kebab-case for class names and properties (background-color, not backgroundColor).

Naming env var convention?

CONSTANT_CASE (uppercase with underscores). Universal across shells, programming languages, container runtimes. DATABASE_URL, API_KEY, NODE_ENV.

Handling acronyms — Url or URL?

Modern style: Url (treat acronym as a normal word). Older style: URL (preserve all-caps). JavaScript stdlib mostly uses Url (XMLHttpRequest is the famous exception — and you can see why people regret it). Pick one and apply consistently.

Is my text sent anywhere?

No — all conversion runs in your browser using the open-source change-case library. Network tab will show zero requests.