Text Case in Programming: camelCase, snake_case, kebab-case and Why
The different case conventions in programming, where each is standard, and how to convert between them.
The four cases you'll meet daily
camelCase
First word lowercase, subsequent words capitalized. Standard in JavaScript variables, Java methods and Swift.
PascalCase
Every word capitalized. Used for class names in most languages and for React components.
snake_case
All lowercase, words separated by underscores. Standard in Python, Ruby, and most database column names.
kebab-case
All lowercase, hyphens between words. Standard in URLs, CSS class names and HTML attributes.
Why conventions matter
Consistency is the whole point. A codebase that mixes snake_case and camelCase in the same file signals sloppiness and hurts readability.
Follow the convention of the language and the framework, not your personal preference. Python is snake_case. JavaScript is camelCase. CSS is kebab-case. React components are PascalCase. Fight this and you'll fight your linter for the rest of your career.
Converting between cases
Renaming a hundred variables from snake_case to camelCase by hand is a recipe for typos. Any Text Case Converter handles the mapping cleanly, and modern IDEs have case-conversion actions built in.
For URL slugs specifically, always convert to kebab-case with a dedicated slugifier — you want stop words removed and diacritics stripped, not just case changed.
Key takeaways
Match the case convention of the language and framework.
Convert with a tool, not by hand — typos in identifiers cost hours.
URLs are kebab-case; databases are snake_case; JavaScript is camelCase; classes and components are PascalCase.
Frequently asked questions
- What about SCREAMING_SNAKE_CASE?
- Standard for constants in most C-family and Python code.
- Is kebab-case allowed in JavaScript variables?
- No — hyphens are invalid identifier characters. Use camelCase for JS variables.
- How do I convert acronyms cleanly?
- Most style guides treat acronyms as words: 'httpUrl' not 'HTTPUrl'. The Text Case Converter follows the same rule.
- Should CSS custom properties use kebab-case?
- Yes — '--brand-color', not '--brandColor'.
- What case for React components?
- PascalCase always — React uses that to distinguish components from HTML elements.
- Can I mix cases in one project?
- Only across languages that require different conventions. Within one language, stay consistent.
We build and document free, privacy-first browser tools used by writers, students, marketers and developers. Every article is written and reviewed by the same team that ships the tools.
Expertise: Writing workflows, SEO content, text processing, front-end performance
- Last updated:
- Reading time:
- 4 min