CSS Portal

Online Case Converter

Change the case of any text in one click. Type or paste your text and pick one of 14 cases: UPPERCASE, lowercase, Sentence case, Title Case and more for writing, or camelCase, snake_case, kebab-case and the other naming conventions for code. Every button previews your own text, the result updates as you type, and acronyms such as HTML stay in capitals. Copy or download the result. Your text never leaves your browser.

β˜•
Enjoying this site?

Help keep it running with a small coffee donation. Every bit of support is appreciated!

Buy us a coffee

TXTYour text

Text cases

Code cases Β· for variable names, CSS classes, URLs and keys

OUT

FormatExampleCommon Use Cases
UPPERCASEHELLO WORLDHeadings, acronyms, warnings, emphasis, legal text
lowercasehello worldEmail addresses, usernames, URLs, casual copy
Sentence caseHello worldBody text, UI labels, subtitles, chat messages
Title CaseHello WorldHeadlines, book and film titles, article headings, menus
Capitalized CaseHello World Of CodeEvery word capitalised, with no minor-word rules
aLtErNaTiNghElLo WoRlDMemes, sarcasm, social media posts, creative styling
iNVERSE cASEhELLO wORLDStylistic inversion, design mockups, creative text art
camelCasehelloWorldJavaScript/Java variables, JSON keys, object properties
PascalCaseHelloWorldClass names, React components, TypeScript interfaces
snake_casehello_worldPython variables, database columns, file names, Ruby
kebab-casehello-worldCSS classes, HTML attributes, URL slugs, CLI flags
CONSTANT_CASEHELLO_WORLDEnvironment variables, constants, macros, config keys
Train-CaseHello-WorldHTTP header names such as Content-Type
dot.casehello.worldConfig namespaces, logging keys, package identifiers
β˜•
Enjoying this site?

Help keep it running with a small coffee donation. Every bit of support is appreciated!

Buy us a coffee

About the Case Converter

The Case Converter changes the capitalisation of your text without touching anything else. The text cases keep every space, punctuation mark and line break and change only the letters. The code cases split your text into words and join them again in the naming style you need, so you can turn a heading into a CSS class or a URL slug, or switch a variable name from camelCase to snake_case.

How the Case Converter works

πŸ”’ Privacy & Security

The converter runs entirely in your browser. Your text isn't sent to a server, stored or logged, so you can use it with confidential material, and there's no account to create. Only the case you chose and your two settings are remembered in your browser.

⚑ How It Works

The result and the preview on every button update as you type. Each case has its own rules. Title Case keeps minor words like "and", "the" and "of" in lower case unless they start or end the title. Sentence case capitalises the first word after every full stop, question mark, exclamation mark and line break, and the word "I". Letters from any language are handled, not just A to Z.

πŸ‘¨β€πŸ’» For Developers

camelCase, PascalCase, snake_case, kebab-case, CONSTANT_CASE, Train-Case and dot.case are the code cases. They treat spaces, punctuation and symbols as word breaks, and also split names that are already in camelCase, so userAccountId becomes user-account-id. Each line becomes its own name, which suits lists of variables, CSS classes, JSON keys, URL slugs and environment variables.

✍️ For Writers & Editors

Sentence case and Title Case are the formats most useful for written content. Sentence case suits body copy and UI labels; Title Case is the standard for headlines, book titles, and article headings in most style guides. UPPERCASE is common in legal text and acronyms, while Alternating and Inverse are popular for memes and creative styling.

Frequently Asked Questions

Does Title Case handle minor words correctly?

Yes. Title Case follows the usual AP and Chicago rules: articles (a, an, the), short conjunctions (and, but, or, nor, for, so, yet) and short prepositions (as, at, by, in, of, off, on, per, to, up, via) stay lower case. The first and last words, and the first word after a colon, are always capitalised. Each part of a hyphenated word is treated as a word, so state-of-the-art becomes State-of-the-Art. If you just want every word capitalised, use Capitalized Case.

Will it keep acronyms such as HTML or NASA?

Yes. With Keep acronyms in capitals switched on, Sentence case, Title Case and Capitalized Case leave words that are already all capitals as they are. When the whole text is in capitals, the switch is ignored and every word is converted.

What happens to punctuation in the code cases?

For camelCase, PascalCase, snake_case, kebab-case, CONSTANT_CASE, Train-Case and dot.case, spaces, punctuation and symbols mark where words start and end and are then removed. Apostrophes are dropped (don't becomes dont). Numbers and accented letters are kept.

Can I convert names that are already in camelCase or snake_case?

Yes. The code cases also split words at capital letters and inside acronyms, so userAccountId, user_account_id and user-account-id all become the same words. XMLHttpRequest becomes xml_http_request in snake_case, for example. That makes it easy to switch a name from one convention to another.

Can I convert multi-line text?

Yes. The text cases keep your line breaks exactly as they are. For the code cases, Convert each line separately turns every line into its own name, which is handy for a list of variables or CSS classes. Switch it off to join all the lines into one name.

Is there a character limit?

No. Everything runs in your browser, so the only limit is your device's memory. Documents of tens of thousands of words convert instantly. You can also open a text file of up to 5 MB.

How does Alternating Case decide which letters to capitalise?

It goes through the letters one by one, starting with a lower-case letter, and switches between lower and upper case. Spaces, punctuation and numbers are left unchanged and don't affect the pattern.

What is the difference between camelCase and PascalCase?

Both join words without spaces and start each word with a capital letter. camelCase keeps the first word in lower case (helloWorld), while PascalCase capitalises it too (HelloWorld). camelCase is the convention in JavaScript for variables and functions; PascalCase is used for class names and React components.

What is the difference between snake_case and kebab-case?

Both write every word in lower case with a separator between them: snake_case uses an underscore (_) and kebab-case a hyphen (-). snake_case is common in Python, database column names and file names. kebab-case is the standard for CSS class names, HTML attributes, URL slugs and command-line flags.

What is CONSTANT_CASE and when should I use it?

CONSTANT_CASE (also called SCREAMING_SNAKE_CASE) writes every word in capitals separated by underscores, for example MAX_RETRY_COUNT or API_BASE_URL. It's the usual convention for constants and environment variables in JavaScript, Python, Java, C and most other languages.

What are Train-Case and dot.case used for?

Train-Case capitalises each word and joins them with hyphens, as in HTTP header names such as Content-Type and Cache-Control. dot.case joins lower-case words with dots, as in configuration keys (app.server.port), logging namespaces and translation keys.

What is the difference between Sentence case and Title Case?

Sentence case capitalises only the first word of each sentence (and the word I), leaving the rest in lower case, as you would write a normal sentence. It suits body text, buttons and UI labels. Title Case capitalises every important word and is used for headlines, book titles and article headings.

What is Inverse Case?

Inverse case (also called toggle case) swaps the case of every letter, so Hello World becomes hELLO wORLD. It's mostly used for fixing text typed with Caps Lock on by mistake, and for creative effects.

Is my text kept private when using this tool?

Yes. The converter runs entirely in your browser. Your text isn't sent to a server, stored or logged, so you can use it with confidential material. Only the case you chose and the two settings are remembered in your browser.

Which case format should I use for CSS class names?

kebab-case is the standard for CSS class names, for example .button-primary or .nav-link-active, and it's what utility frameworks such as Tailwind and Bootstrap use. BEM adds double underscores and hyphens to it (.card__title--large).

Which case format should I use for URL slugs?

kebab-case is recommended for URL slugs, for example /blog/how-to-write-clean-code. Search engines read hyphens as word separators, while underscores aren't treated that way everywhere. Avoid spaces, which turn into %20.

β˜•
Enjoying this site?

Help keep it running with a small coffee donation. Every bit of support is appreciated!

Buy us a coffee