How to convert text between cases (camelCase, snake_case, kebab-case)

Your Python backend sends first_name, your React app wants firstName, the CSS class is first-name, and the environment variable is FIRST_NAME. Same two words, four spellings, and every one of them is correct somewhere.

This guide walks through the common case conventions, where each one is expected, and how to convert between them without retyping everything by hand.

Why naming conventions matter

A consistent convention makes code easier to scan, and it hints at what a name is: in JavaScript, UserProfile is probably a class or component and MAX_RETRIES is a constant. It also matters for correctness. JSON keys are case-sensitive, so if the API sends user_id and your code reads userId, you get undefined and no error message.

The main case conventions

camelCase

The first word is lowercase, every word after it starts with a capital, and there are no separators. The capitals stick up like the humps on a camel, hence the name.

userName
getUserById
isAuthenticated
httpResponseCode
backgroundColor

Used for: variables, functions and object properties in JavaScript and TypeScript; local variables and methods in Java, Swift and Kotlin; JSON fields in many APIs.

PascalCase

Also called UpperCamelCase. It's camelCase with the first word capitalized too.

UserProfile
HttpClient
DatabaseConnection
AuthProvider

Used for: class names in almost every language; React components (JSX treats lowercase tags as HTML elements); C# methods and public properties; TypeScript interfaces and type aliases; enum names; enum variants in Rust.

snake_case

All lowercase, with underscores between words. The underscores make word boundaries easy to see, even in long names.

user_name
get_user_by_id
max_retry_count
created_at

Used for: variables, functions and modules in Python (PEP 8), Ruby and Rust; SQL table and column names; many PHP built-in functions; JSON fields in APIs such as GitHub’s and Stripe’s.

kebab-case

All lowercase, with hyphens between words, like pieces on a skewer. Most programming languages read user-name as user minus name, so kebab-case mostly lives outside code: in CSS, HTML and URLs.

background-color
max-retry-count
my-component
data-user-id

Used for: CSS properties and class names; HTML attributes, including data-*; URL slugs; npm package names; file names in many frontend projects; Lisp and Clojure names.

SCREAMING_SNAKE_CASE

Also called CONSTANT_CASE. All uppercase with underscores, so the name looks like it's shouting. That's deliberate: it signals "this is a constant, don't reassign it".

MAX_RETRY_COUNT
API_BASE_URL
NODE_ENV
SECRET_KEY

Used for: constants in most languages; environment variables; enum values in C and Java; C and C++ preprocessor macros.

Language conventions at a glance

These are the defaults most style guides and linters expect. Individual projects sometimes differ, so check the codebase you're in first.

Converting cases in code

Every conversion is two steps. First split the input into lowercase words, whatever case it started in. Then join the words using the target convention's rules. The tricky part is the split: you have to spot word boundaries at underscores, hyphens, dots, slashes and the switch from lowercase to uppercase.

JavaScript

// Split any case into lowercase words
function splitWords(str) {
  return str
    .replace(/([a-z\d])([A-Z])/g, "$1 $2") // camelCase boundaries
    .replace(/([A-Z]+)([A-Z][a-z])/g, "$1 $2") // "XMLParser" -> "XML Parser"
    .replace(/[_\-.\/]+/g, " ") // separators
    .trim()
    .toLowerCase()
    .split(/\s+/);
}

const capitalize = (w) => w.charAt(0).toUpperCase() + w.slice(1);

const toCamelCase = (s) => {
  const [first, ...rest] = splitWords(s);
  return first + rest.map(capitalize).join("");
};
const toPascalCase = (s) => splitWords(s).map(capitalize).join("");
const toSnakeCase = (s) => splitWords(s).join("_");
const toKebabCase = (s) => splitWords(s).join("-");
const toScreamingSnake = (s) => toSnakeCase(s).toUpperCase();

console.log(toCamelCase("user_first_name")); // "userFirstName"
console.log(toSnakeCase("getUserById")); // "get_user_by_id"
console.log(toKebabCase("BackgroundColor")); // "background-color"
console.log(toScreamingSnake("maxRetryCount")); // "MAX_RETRY_COUNT"
console.log(toPascalCase("my-component-name")); // "MyComponentName"

Python

import re

def split_words(s: str) -> list[str]:
    """Split any case convention into a list of lowercase words."""
    s = re.sub(r"([a-z\d])([A-Z])", r"\1 \2", s)
    s = re.sub(r"([A-Z]+)([A-Z][a-z])", r"\1 \2", s)
    s = re.sub(r"[_\-./]+", " ", s)
    return s.lower().split()

def to_camel_case(s: str) -> str:
    first, *rest = split_words(s)
    return first + "".join(w.capitalize() for w in rest)

def to_pascal_case(s: str) -> str:
    return "".join(w.capitalize() for w in split_words(s))

def to_snake_case(s: str) -> str:
    return "_".join(split_words(s))

def to_kebab_case(s: str) -> str:
    return "-".join(split_words(s))

print(to_snake_case("getUserById"))       # get_user_by_id
print(to_camel_case("background_color"))  # backgroundColor
print(to_kebab_case("MyComponentName"))   # my-component-name

Choosing a convention for an API

• JSON REST APIs commonly use camelCase because JavaScript is the main consumer. Google’s JSON style guide recommends it.
• snake_case JSON is also widespread, especially for backends in Python or Ruby. GitHub and Stripe both use it. The trade-off is that JavaScript clients either convert the keys or use snake_case properties.
• GraphQL fields are conventionally camelCase.
• Database columns are usually snake_case. If your application uses camelCase, map the names in the ORM (the library that turns database rows into objects, such as Prisma or SQLAlchemy).
• URL paths use kebab-case. Google treats hyphens as word separators but not underscores, so kebab-case slugs are better for search.

{
  "userId": 42,
  "firstName": "Alice",
  "createdAt": "2026-02-10T12:00:00Z",
  "isVerified": true
}

{
  "user_id": 42,
  "first_name": "Alice",
  "created_at": "2026-02-10T12:00:00Z",
  "is_verified": true
}

Whichever you pick, use it everywhere. An API where half the endpoints say createdAt and the other half say created_at is one nobody enjoys using. If different clients want different conventions, convert the keys in one place, in the serialization layer, rather than all over the codebase.

How to use the case converter

1. Open the case converter and type or paste your text. It accepts any mix of camelCase, PascalCase, snake_case, kebab-case, dot.case, path/case and plain words.
2. The results update as you type. The table shows 12 formats at once: camelCase, PascalCase, snake_case, SCREAMING_SNAKE_CASE, kebab-case, SCREAMING-KEBAB-CASE, Title Case, UPPERCASE, lowercase, Sentence case, dot.case and path/case.
3. Select the copy button next to the format you need.

The tool runs in your browser, so nothing you paste is sent anywhere. One thing to know: it treats an acronym as a single word and lowercases it, so XMLParser becomes xmlParser in camelCase and xml_parser in snake_case.

Practical tips

• Let a linter enforce it. ESLint’s camelcase rule (or @typescript-eslint/naming-convention), Pylint’s invalid-name check and RuboCop’s Naming cops catch inconsistent names.
• Map names in the ORM. In Prisma, name the field in camelCase and add @map("first_name"). In SQLAlchemy, pass the column name to mapped_column("first_name").
• Treat acronyms as words. Most style guides write httpResponseCode, not hTTPResponseCode or HTTPResponseCode.
• Keep file and component names aligned. A common frontend pattern is a kebab-case file (user-profile.tsx) that exports a PascalCase component (UserProfile).