Complete Guide to Text Case Conventions
March 2025
Text case conventions determine how words are capitalized and separated. Different contexts use different styles: code uses camelCase and kebab-case, URLs use kebab-case, SQL uses snake_case, and headings use title case. Get it wrong and you get broken links, style warnings, or code that fails to compile. This guide explains each convention, when to use it, and how to convert between formats using our case conversion tools.
Case matters at every layer of software and content. A URL with mixed case can behave differently on case-sensitive servers. A React component named userProfile instead of UserProfile breaks imports. Database columns in PascalCase clash with Python's snake_case norms. We will cover the five main conventions plus sentence case, lowercase, and uppercase, with language-specific notes and conversion workflows.
camelCase
camelCase starts with a lowercase letter; each subsequent word is capitalized. firstName, getUserById, isValidEmail. Common in JavaScript, Java, Swift, and Kotlin for variables and functions. Use the camelCase converter to generate or convert from other formats.
Acronyms and abbreviations
Acronyms are often lowercase in camelCase: parseJson, getHtmlElement, xmlParser. Some style guides (e.g., Microsoft C#) prefer parseJSON or parseJson for two-letter acronyms. Google's JavaScript style guide recommends treating two-letter acronyms as words (getId), but longer ones as single caps (parseXML). Consistency within a project matters more than the specific choice. Mixing getUserId and getUserID in the same codebase confuses readers.
camelCase is the default for JSON property names in JavaScript APIs. When consuming or producing JSON, match the API's convention. The camelCase converter can batch-convert heading text or snake_case keys into camelCase for API payloads.
PascalCase
PascalCase capitalizes every word, including the first. UserProfile, HttpClient, OrderDetails. Used for class names, types, interfaces, and components. In React, every component is PascalCase; UserCard is correct, userCard would be treated as a DOM element. C#, TypeScript, and Swift use PascalCase for types. The PascalCase converter produces this format.
File names for components often match: UserProfile.tsx, OrderDetails.js. Some teams use kebab-case for file names (user-profile.tsx) while the export remains PascalCase. Both work; the important part is that the exported symbol matches the file's primary export.
kebab-case
kebab-case uses hyphens between words, all lowercase. user-profile, get-started, contact-us. Standard for URLs, CSS class names, HTML attributes, and file names in many projects. Google treats hyphens as word separators in URLs; underscores can blur words. The kebab-case converter and slug generator create this format. See the Complete Guide to SEO-Friendly URL Slugs for URL-specific best practices.
CSS class names use kebab-case by convention: .nav-menu, .hero-section. BEM (Block Element Modifier) extends this: block__element--modifier. HTML5 custom data attributes use kebab-case: data-user-id. CLI flags and config keys often use kebab-case: --max-retries, max-retries.
snake_case
snake_case uses underscores between words. user_name, created_at, is_active. Common in Python (PEP 8), Ruby, and SQL. Database column names often use snake_case because SQL identifiers are case-insensitive on some systems; underscores make multi-word names readable. The snake_case converter handles conversion.
Python's style guide (PEP 8) specifies snake_case for functions and variables. Ruby uses snake_case for methods and variables. PHP historically used snake_case for function names. When working across languages, snake_case is a safe default for API fields that cross the Python–JavaScript boundary; both sides can parse it. Converting snake_case to camelCase at the API boundary is common in Node backends serving frontend clients.
Title Case
Title case capitalizes the first letter of each major word. "How to Write Clean Code", "The Art of Computer Programming". Used for headings, titles, book names, and document titles. Rules vary: AP style capitalizes "to" in "How to"; others do not. The title case converter applies configurable rules so you can match your style guide.
Minor words (a, an, the, and, but, or, nor, for, so, yet, as, at, by, in, of, on, to, up) are typically lowercase unless they start the title or follow a colon. Conjunctions, articles, and prepositions under four letters are often lowercase. "To" and "as" sometimes get capitalized depending on the guide. When converting headings to slugs, use the slug generator after title-casing; it will strip to kebab-case.
Other case styles
lowercase: All letters lowercase. Used for URLs, slugs, and when you need to normalize input. The lowercase converter strips all caps. Useful before running case-sensitive comparisons or when preparing text for slug generation.
UPPERCASE: All letters uppercase. Used for constants in some languages (e.g., MAX_RETRY_COUNT in Python), acronyms, or emphasis. The uppercase converter handles this. Avoid for long text; uppercase is harder to read.
Sentence case: Only the first letter of the first word is capitalized. "How to write clean code." Used for body text, descriptions, and UI labels. The sentence case converter applies this. Differs from title case in that it leaves most words lowercase.
Inverse case: The inverse case tool flips the case of each character (e.g., "Hello" becomes "hELLO"). Mostly for stylistic effect or testing. The conditional capitalization tool applies rules like "capitalize after periods" for more control.
When to use which
| Context | Convention |
|---|---|
| JavaScript, Java, Swift variables and functions | camelCase |
| React components, C#/TypeScript classes and types | PascalCase |
| URLs, slugs, file names, CSS classes, HTML data attributes | kebab-case |
| Python, Ruby, SQL identifiers, database columns | snake_case |
| Headings, titles, book names | Title Case |
| Constants (Python, some C-style langs) | UPPER_SNAKE |
| Body text, descriptions, UI labels | Sentence case |
When converting between formats, use the tool that matches your target. Converting "User Profile Page" to a URL slug: use the slug generator or kebab-case converter. Converting a heading to a React component name: use PascalCase. Converting API keys from snake_case to camelCase for a frontend: use camelCase. See slug generator vs title case for when to use each.
Common mistakes
- Mixing cases in URLs. Use lowercase. Some servers treat /About and /about as different pages. Lowercase avoids duplicate content and 404s.
- Using underscores in URLs. Hyphens are standard. Google treats hyphens as word separators; underscores can merge words in search indexing.
- PascalCase for variables in JavaScript. Use camelCase. PascalCase signals a constructor or component; using it for variables is misleading.
- camelCase for React components. Use PascalCase. React treats lowercase tags as HTML elements;
userCardrenders ausercardDOM element, not your component. - Inconsistent acronym handling. Pick a rule (e.g.,
getIdvsgetID) and stick to it project-wide.
Tools
Case converters: camelCase, PascalCase, kebab-case, snake_case, Title Case. Utilities: Lowercase, Uppercase, Sentence Case, Slug Generator. Browse all text case conversion tools.
Frequently asked questions about text case
Back to Learn · Case tools · Glossary: camelCase · Glossary: kebab-case